Not sure how to come out of this.
This statement is unclear to me from the challenge - This style will be applied because of a typo in the variable name.
If the variable, --penguin-skin
is misspelt, then the black color is getting applied. Is that the way to verify the fallback color. However, the test fails.
Could anyone help fix this. Appreciate the help!
Code so far:
.penguin-top {
top: 10%;
left: 25%;
/* change code below */
background: var(--penguin-skin, black);
/* change code above */
width: 50%;
height: 45%;
border-radius: 70% 70% 60% 60%;
}
.penguin-bottom {
top: 40%;
left: 23.5%;
/* change code below */
background: var(--penguin-skin, black);
/* change code above */
width: 53%;
height: 45%;
border-radius: 70% 70% 100% 100%;
}
Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable