Product landing page single problem

HTML-CSS
1

I can’t pass the last test. Help
Pen: https://codepen.io/PufflyMuffin/pen/JjrPyyw?editors=1100

2

The error on the last test says:

The navbar should always be at the top of the viewport.

#header or one of its children should be at the top of the viewport

The top of the viewport is different from the top of the page. The top of the view port means that the navbar will always display at the top no matter how much you scroll vertically. Right now your navbar is fixed to the top of the page instead of the top of the viewport. There is a CSS position value that will allow you to fix it to the top of the viewport instead.

1 Like
3

Try to position #nav-bar at the top.
so that it stays at the top always no matter how much you scroll vertically.

1 Like
4

Well, I did it and it worked. But there is a thing that it only scrolls on top a bit and after that, it doesn’t come along. Couldn’t pass the test either

5

I fixed it a bit but now other elements don’t allow me to see when I scroll down.

6

I don’t think sticky positioning is what you want here. You want the menu bar to be at the top of the view port at ALL times. In other words, fixed to the top of the view port.

7

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