Bootstrap navbar-fixed-top class, not working

2019-04-07 04:35发布

问题:

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

回答1:

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.



回答2:

I think there is something wrong with the way your are loading in your bootstrap. Make sure you call jquery before you call the bootstrap files. If nothing works you could always add the fixed positioning yourself:

.navbar-fixed-top {
    position:fixed !important;
}