引導程序3 Navbar在自定義斷點處不崩潰

我已使用this config進行了自定義引導。我已經設置了引導程序3 Navbar在自定義斷點處不崩潰

"@grid-float-breakpoint": "810px", 
"@grid-float-breakpoint-max": "800px"

但是，導航條似乎並沒有在800像素或其他任何接近的情況下崩潰。導航欄在600-650px左右摺疊。我究竟做錯了什麼。我是否還需要更改其他值？

導航欄

<nav id="navbar" class="navbar navbar-default navbar-fixed-top" role="navigation" data-selected="#new-li"> 
<div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
      <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"> 
      </span> 
     </button> 
     <a class="navbar-brand" href="#"><img src="/C5.WebApp/Content/logo.png" alt="logo"></a> 
    </div> 
    <div class="navbar-collapse collapse navbar-responsive-collapse"> 
     <ul class="nav navbar-nav navbar-right"> 
      <li id="inbox-li"><a href="/C5.WebApp/">Posteingang</a></li> 
      <li id="tasks-li"><a href="/C5.WebApp/Tasks">Aufgaben</a></li> 
      <li id="calendar-li"><a href="/C5.WebApp/Calendar">Kalender</a></li> 
      <li id="contacts-li"><a href="/C5.WebApp/Contacts">Kontakte</a></li> 
      <li class="active" id="new-li"><a href="/C5.WebApp/Activity/Create">Neue Aktivität</a></li> 
      <li><a href="/C5.WebApp/Login/Logout">Abmelden</a></li> 
     </ul> 
    </div> 
</div>

來源

2014-09-12 Georgi Georgiev

我嘗試了和你一樣的變量，它對我來說工作正常。我認爲你需要提供更多的細節。在瀏覽器中，檢查'.navbar-toggle'按鈕並查看媒體查詢的最小寬度設置爲。 – Schmalzy 2014-09-12 14:16:26

@Schmalzy我沒有設法找到谷歌的最小寬度屬性 – 2014-09-12 14:34:05

檢查bootstrap.css文件（非精縮），開始對行3911，你應該看到下面的代碼......確保min-width: 810px是正確的。

@media (min-width: 810px) 
    .navbar-toggle { 
    display: none; 
    } 
}

如果這是正確的，那麼您要麼有一些自定義CSS覆蓋斷點，要麼沒有在HTML文件中鏈接正確的CSS文件。

來源

2014-09-12 15:00:00 Schmalzy

寬度是正確的 – 2014-09-15 07:28:00

我希望您的問題是由於您的<nav>內部使用<div class="container">而不是<div class="container-fluid">引起的。

在斷點設置爲768px（等於xs網格的最大大小）的默認情況下，問題不會發生，因爲.container類沒有固定寬度，屏幕寬度低於768px（網格是流體）。 768以上的.container類將寬度設置爲750px ;.對於圍繞800px的新斷點，sm柵格中的.container類的此固定寬度將導致您的問題。 container-fluid類不設置固定寬度。

來源

2014-09-12 21:51:20

將容器更改爲流體，也不工作 – 2014-09-15 07:26:58

引導程序3 Navbar在自定義斷點處不崩潰

回答

相關問題