Broken test: Step 5 of Learn CSS transforms by building a penguin

Describe the Issue

Instruction: Remove both the horizontal and vertical scrollbars, and prevent programmatic scrolling, using only one property. Hint: You should give body and overflow of clip. I typed in overflow: clip; to the list of properties: values; within the body selector. Even the hint is giving me the same answer, but the code will not pass. I tried different browsers, checked for extensions and updates, but so far nothing has fixed this.

Affected Page

https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-css-transforms-by-building-a-penguin/step-5

Your code

body { background-color: linear-gradient(45deg, rgb(118, 201, 255), rgb(247, 255, 222)); margin: 0; padding: 0; width: 100%; height: 100vh; overflow: clip; }

Expected behavior

Since I typed overflow: clip; I expected the overflow to be clipped with the rest of the content hidden, and scrolling should be forbidden. According to the hint that comes up and the forum post about this exact issue, I’ve entered the correct code. However, the test keeps failing.

Screenshots

No response

System

• Device: iPad Pro
• OS: iOS 15.6.1
• Browser: Safari, Chrome, Firefox
• Version: iPadOS 15.6.1

Additional context

No response

[moT01]

Thanks @Gerschuk

Yea, I think we should definitely change this lesson then - the overflow: hidden suggestion I made on the PR might be the better way to go for this particular step. I believe we use that clip property somewhere else in the curriculum, as I mentioned on the PR - we should maybe find where it is and see if we want to change that one (those ones?), as well.

[Gerschuk]

Hi everyone. The clip property in css is deprecated. https://developer.mozilla.org/en-US/docs/Web/CSS/clip I think this step needing change to use clip-path property. Sorry for my english i’m work in it. Regards.