Learn CSS Transforms by Building a Penguin - Step 5

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Remove both the horizontal and vertical scrollbars, and prevent programmatic scrolling, using only one property.

  **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <link rel="stylesheet" href="./styles.css" />
  <title>Penguin</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>

<body>
</body>
</html>

/* file: styles.css */
body {
background: linear-gradient(45deg, rgb(118, 201, 255), rgb(247, 255, 222));
margin: 0;
padding: 0;
width: 100%;
height: 100vh;
overflow-x:hidden;
overflow-y:hidden;
overflow: clip;

}

  **Your browser information:**

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

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

Link to the challenge:

2

hi Ahmed,

Did you need some help with this? What part or instruction are you struggling to apply?

3

Remove both the horizontal and vertical scrollbars, and prevent programmatic scrolling, using only one property

4

I’m still not sure if you have a specific question?
(so far you have posted the instructions and your code but no question)

5

i cant understand this instruction and i wrote in code what i understood but still an error provided

6

ah ok. I see the problem.
You have too much code.
You only need one new line of code to solve this one. (the last one you have should work nicely, remove the others)

7

it doesn’t work , the problem is the same

1 Like
8

Hello, can you post your full code here again? (Just reply to the post here and put your code in a code block using the pre formatted editor option which looks like this </>)

9

i solved it thank you so much with your effort
i had a problem with the extension of the chrome

2 Likes
10

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