Navbar top of viewport help!

I can’t seem to format the nav bar correctly. I want it as a box with links, but it’s a mess right now. Can someone please point me in the right direction? Here is my code. Thank you!

Made a Basic stater for you. sent you the message

hi @brianammorgan!

You’re on the right way :slight_smile: the nav-bar is already fixed at the top - try giving it a background color and you’ll see more clearly.

You’ll then need to style the links to your liking. They’re sitting inside a ul element now, so try styling ul with display: flex; to get them into a row. You might also want to add some margins and list-style: none; to get rid of the bullets.

Your book seems really cool!

Thank you so much! I’ve made some changes, but I’m having trouble getting the links in the nav spaced out so they’re not all jumbled together. I think my logo/title also need to be part of the navbar somehow? Anyway, if you offer any more advice, I’d appreciate it!

You can add (still on the ul element)

justify-content: space-around;

That might be what you want :slight_smile: there are other alternatives too, you can check this site out for reference:

You can still have the logo in the main section if you prefer, but you need to use padding-top to push it down so it’s not covered by the header. The usual approach is to wrap all of the main content in a wrapper div and then give that div a padding-top that is equivalent to the header height.