Bootstrap断点

Question

我已经使用bootstrap几年了，而且我从来没有遇到过我现在遇到的问题。现在我遇到了768px断点的问题，没有像它应该那样折叠导航栏。我正在使用BS 3.3.5缩小的CSS。它将以767px折叠导航栏。我已经启动了自己的查询，但它的引导程序不允许导航栏崩溃。我保证我知道自己在做什么。但这是BS断点第一次不起作用。我查看了未经通知的文件，它说断点是767px，但我不明白为什么它会从BS 3.3.2中的768px改变。当我把它放到767px时，我的所有列都拉-xs而不是-sm但是在768px时它会拉出正确的列大小，但它不会折叠导航栏。

我的导航。

<div id="main-nav">
   <nav class="navbar navbar-default">
       <div class="container-fluid">
       <!-- Brand and toggle get grouped for better mobile display -->
          <div class="navbar-header">
              <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-navbar" aria-expanded="false">
                  <span class="sr-only">Toggle navigation</span>
                  <span class="icon-bar"></span>
                  <span class="icon-bar"></span>
                  <span class="icon-bar"></span>
               </button>
          </div><!-- end of navbar header -->

          <!-- Collect the nav links, forms, and other content for toggling -->
          <div class="collapse navbar-collapse container" id="main-navbar">
              <ul class="nav navbar-nav">
                  <li><a href="#">Home</a></li>
                  <li><a href="#">Our Story</a></li>
                  <li><a href="#">Sausage</a></li>
                  <li><a href="#">Pork</a></li>
                  <li><a href="#">Beef</a></li>
                  <li><a href="#">Country Store</a></li>
                  <li><a href="#">Blog</a></li>
                  <li><a href="#">Recipes</a></li>
                  <li><a href="#">Locations</a></li>                                
              </ul>

           </div><!-- /.navbar-collapse -->
       </div><!-- /.container-fluid -->
   </nav>
</div><!-- end of main-nav -->