Learn CSS Transforms by Building a Penguin - Step 88

HTML-CSS
1

Hello. Bee trying to solve this task for a couple of hours. Please take a look, maybe someone can help. This is the first question on this task. Seems to me like I did everything right. This is the task: Create a custom CSS variable named --penguin-skin , and set it to gray . Then, replace all relevant property values with it.

** The mistake i get: You should give .penguin-body: :before a background-color of var(--penguin-skin) , but found `` .**

WARNING

:root {
  --penguin-face: white;
  --penguin-picorna: orange;
  --penguin-skin: gray; 
}
.penguin-body::before{
  content: "";
  position: absolute;
  width: 50%;
  height: 45%;
  background-color:var(--penguin-skin);
  top: 10%;
  left: 25%;
  border-radius: 0% 0% 100% 100%;
  opacity: 70%;
  background:linear-gradient(45deg,var(--penguin-skin), rgb(239, 240, 228));
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36

Challenge: Learn CSS Transforms by Building a Penguin - Step 88

Link to the challenge:

2

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356Ă—380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

3

please reset the code.
I see you deleted the arm selector so that is probably why things aren’t working.

1 Like
4

I’m glad you are answering the question in a simple and easy way. I really appreciate that you are a member of freecodecamp.

5

Ok I got it. Thank you very much.

1 Like
6

I thank you but to be fair, my style of answering changes depending on the question and the issue.
(sometimes I give very obscure hints because that is what I think the person needs to learn from - to think for themselves essentially)
As this is a forum, many people will answer in very different ways. Some ways work for someone but not for someone else.
I am just saying all of this because I get the feeling you have a concern about a response you have seen on here. It is important to know that part of learning to code is learning to communicate with all sorts of people. And sometimes that means not getting the responses in the way that suits you most, but still making the best of the input you receive either way.

1 Like
7

Hello, thank you for responding. That is right, I am new in this chat and I apreciate your help. This is the arm part that was missing. .arm {
width: 30%;
height: 60%;
background: linear-gradient(
90deg,
gray,
rgb(209, 210, 199)
);
}

8

Do you still need help?

9

No, thank you, I solved it.

1 Like