Why does my whole page shrinks when I try to position my nav bar as absolute or fixed?

I am trying to play around with my Nav Bar so it will be fixed at the top when I’m scrolling. Also would like to have my logo in the dead center and the menu items on both sides, but do I have to build that from scratch? I tried dragging but it throws the whole thing off.

Any pointers or guide will be appreciated!

Thank you!
Ivan


Here is my public share link: https://preview.webflow.com/preview/mentworking-international?preview=32d6dc153aa9c908a1dbbeeb34714cd4
([how to access public share link][2])

Well I would drop the class “navbar” off the body. Secondly here’s the setting for a fixed navigation on your Navbar div…

Secondly yes you will need to set the styles for the different displays/breakpoints for your logo ect.

1 Like

I removed the class and it worked!

Thank you!

So I have the position fixed, but there’s a new problem that I encounter, when I scroll down the page, the words will go over the nav bar as well. Is there a way to not have the rest of my page scroll on top of my nav bar, instead let it go under it so my nav bar appears to be on top at all times?

https://preview.webflow.com/preview/mentworking-international?preview=32d6dc153aa9c908a1dbbeeb34714cd4

I’m not seeing that, unless you’re talking about the opacity on the navbar. You can either increase the opacity on the white or you can try setting the z-index on the fixed navigation to something like 9999.

Just saw this vid with your problem . The fix is there… watch it.

Yes I have just made it fixed position, messed it up with the different classes. Thank you!

Rick yeah adjusting the z index pretty much solved the problem.

1 Like

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