Project landing error question about the nav bar

Hello everyone! I’m pretty new to coding so this may be a simple fix but I restarted the project landing project because I kept getting the error saying my nav bar is not at the top of the page. also I’m having issues when I add position fixed it causes the background to disappear. Any help would be appreciated thank you!

The pen you linked to is blank. We’d need to see the one you were working on so we can help you with it. Hey sorry I linked the wrong one. I think I figured it out but added the width with position fixed has made me have to add padding to my h1 and a I am not sure if it really is necessary or if I just messed up.

No, you didn’t mess up. If you have a fixed element at the top of the page then it will overlap other elements at the top of the page so you have to push those elements down below the fixed element. Adding top padding is one way to do that.

Your nav is ok now, you can also add “left: 0” so it covers the entire viewport and looks better, by default body have some margin you can “reset” this value or use “left: 0” as I said for your fixed element.

Another thing, you have relative positioned your body, not sure why, re-check your code probably you don’t need that for this layout.

Your ul element have a display: block property, this is not necessary, ul element have that property by default, you don’t need to specify again unless you changed before. Here you can see all HTML defaults, is pretty handly:

A last tip, be carefull with the organization of your rules, try to make some order that is easy for you to read, for example you have rules for body in 2 different places. Ussually is a good practice to place elements with no classes or ID at the top of the file, starting with html and body tags and following in the order you prefer (alphabetically or in order of appearance on your html structure).

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