Portfolio: Fixed Nav Bar

Portfolio: Fixed Nav Bar
0.0 0

#1

Hello everyone! Was hoping someone could help me fix the nav bar to the top of the screen when scrolling on this https://codepen.io/MarcelPenn/pen/KRXqod project. I tried position: fixed in the nav css, but it made the bar disappear completely lol. Any help would much appreciated!


#2

The bar doesn’t disappear completely when you set it to fixed; it just changes the color to match your background color (you can still see the links if you look carefully). I think this has something to do with the fact that your nav is nested inside of a header. I believe navs are typically used outside of a header; maybe try that?

As a sidenote, you could use bootstrap for your UI elements in this project. It will take care of a lot of this pesky stuff for you.


#3

Ah, ic,. You might be right but taking it outside the header but that gives me a whole bunch of new problems with my current code lol. You did give me a couple of ideas though and maybe I’ll attempt a separate one with bootstrap. Thanks!