Building out portfolio site using Bootstrap - I'm applying the 'navbar-fixed-top' class in order to get the navbar to stick to the top of the window, such as in this example:
https://getbootstrap.com/examples/navbar-fixed-top/
I'm trying to do so using this code:
<nav class="navbar navbar-fixed-top"> <div class="container"> <div id="navbar" class="navbar-collapse"> <ul class="nav navbar-nav"> <li>About</li> <li>Projects</li> <li>Contact Me</li> </ul> </div> </div> </nav>
However, the navbar is still scrollable when I apply it to my own webpage. You can view the page here:
http://codepen.io/BenWS/pen/gmLEVw
Set the navbar fixed to the top, add class . navbar-fixed-top to the . navbar class.
Use the .sticky-top class to make the navbar fixed/stay at the top of the page when you scroll past it.
I found it necessary to add a z-index with a high enough number for the navbar to appear always on top of other elements.
Use the . navbar-text class to vertical align any elements inside the navbar that are not links (ensures proper padding and text color).
Because you are using the newest version of bootstrap (bootstrap4 beta6).
They change from .navbar-fixed-top
to .fixed-top
You have to read document in this link.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With