Product landing page issue with test

Hi guys! I made a product landing page, run the test and I have one error concerning navbar: " 1. 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 : expected 760 to be close to 0 +/- 15". I made my navbar sticky at the top I don’t know what’s going on please help. Here is my solution: https://codepen.io/MagWebDev/pen/mdmxEWp.

Move the nav element out of the .container element. I would put it before it just because that makes the most sense.


You should also validate your HTML and fix the errors.

I would suggest switching the Syntax Highlighting on Codepen. It will help catch syntax errors.

Go to your Codepen profile settings. Under “Editor Preferences” switch the Syntax Highlighting to Oceanic Dark and save the setting. Go back to the pen and make sure your new setting is working, the code highlighting will be using different colors. Press the down arrow to the right of the HTML code box and select Tidy HTML. Now, look at the HTML, if there are issues you should see tags marked in red. That is the new Syntax Highlighting showing you where the problems are.

Press the down arrow to the right of the HTML code box and select “Analyze HTML” then do the same for the CSS. You can also use a validator tool.

1 Like

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