Learn CSS Transforms by Building a Penguin STEP 93

Ummmm… ?? Am I doing something wrong?

.arm {
  width: 30%;
  height: 60%;
  background: linear-gradient(
    90deg,
    var(--penguin-skin),
    rgb(209, 210, 199)
  );
  border-radius: 30% 30% 120% 30%;

}

The hint is incorrect.
from the border-radius - CSS: Cascading Style Sheets | MDN docs, an example of how to write border radius is:

/* top-left | top-right | bottom-right | bottom-left */
border-radius: 1px 0 3px 4px;

top-left, top-right, bottom-right are 30% and bottom left is 120%. Let me know if you need more hints

I am not sure how to specify areas like "top-left; top-right; bottom-right; bottom-left… While using border-radius next digits (all four of them) (x x x x) specify top, right, bottom and left (clockwise). Is it the same for top-left; top-right; bottom-right; bottom-left ? I don’t know when to use px or % or unspecified numbers :frowning:

You are SO CLOSE. Your format is correct. You’re doing it right, the issue you have is that your %'s are mixed up a bit (the hint is wrong). The example that i gave you, shows you the correct order for when you are using 4 numbers:
/* top-left | top-right | bottom-right | bottom-left */

YOU GOT THIS.

1 Like

God I am stupid. I just thought the problem is much more sophisticated than just a typo in the hint lol

border-radius: 30% 30% 30% 120%;

it is.
Thank you @xoxoKaralee

1 Like

For anyone who comes along after, an issue has been submitted to the github: https://github.com/freeCodeCamp/freeCodeCamp/issues/45035

ETA: Fixed yesterday. PR #45023

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.