私のブートストラップnavbar崩壊ブレークポイントが変更されない

Question

ウェブページの幅が1024px未満だが、それは700ishピクセル幅で崩壊すると、私は自分のブートストラップnavbarを崩壊させようとしている。私はgoogeledしかし運がない解決の多くを試みた。私はこの記事 "Bootstrap 3 Navbar Collapse"からCSSを試してみましたが、私のような問題があります。しかし、私が何をするにしても、私はちょうど1024pxの幅の後で崩壊しません。私はhtml（boostrap navbar）+ cssをコピーしてみると、うまくいくかどうかは分かりますが運がないかどうかを確認しています。

マイCSS

@media (max-width: 1024px) { 
    ul.nav.navbar-nav{ 
    margin-left:-15px; 
} 
    .navbar-header { 
     float: none; 
    } 
    .navbar-left,.navbar-right { 
     float: none !important; 
    } 
    .navbar-toggle { 
     display: block; 
    } 
    .navbar-collapse { 
     border-top: 1px solid transparent; 
     box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); 
    } 
    .navbar-fixed-top { 
     top: 0; 
     border-width: 0 0 1px; 
    } 
    .navbar-collapse.collapse { 
     display: none!important; 
    } 
    .navbar-nav { 
     float: none!important; 
     margin-top: 7.5px; 
    } 
    .navbar-nav>li { 
     float: none; 
    } 
    .navbar-nav>li>a { 
     padding-top: 10px; 
     padding-bottom: 10px; 
    } 
    .collapse.in{ 
     display:block !important; 
    } 
} 

私のブートストラップのナビゲーションバー

<nav> 
<img class="kopakuttlogo" src="kopakuttlogo.jpg" alt="Logo" width="400" height="400"/> 
<div class="navigatsioon"> 
<div class="navbar navbar-default" role="navigation"> 
     <div class="container"> 
    <!-- Brand and toggle get grouped for better mobile display --> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 

    </div> 
    </div> 


<div class="container-fluid"> 
    <!-- Collect the nav links, forms, and other content for toggling --> 
    <div class="navbar-collapse collapse"> 
     <ul class="nav navbar-nav"> 
      <li><a href="http://www.haaboja.ee/" class="active">AVALEHT</a></li> 
     <li><a href="Hinnakiri.php">HINNAKIRI</a></li> 
     <li><a href="Renditingimused.php">RENDITINGIMUSED</a></li> 
     <li><a href="tehnika.php">TEHNIKA</a></li> 
     <li><a href="kontakt.php"></span>KONTAKT</a></li> 
     </ul> 



     </li> 
     </ul> 
     </div><!-- /.navigatsioon --> 
     </div> 
    </div><!-- /.navbar-collapse --> 
    </div><!-- /.container-fluid --> 
    </nav> 

Answer 1

ねえ、私はそれがどこにでも

@media (max-width: 1024px) { 
    .navigatsioon ul.nav.navbar-nav{ 
    margin-left:-15px; 
} 
    .navigatsioon .navbar-header { 
     float: none; 
    } 
    .navigatsioon .navbar-left,.navbar-right { 
     float: none !important; 
    } 
    .navigatsioon .navbar-toggle { 
     display: block; 
    } 
    .navigatsioon .navbar-collapse { 
     border-top: 1px solid transparent; 
     box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); 
    } 
    .navigatsioon .navbar-fixed-top { 
     top: 0; 
     border-width: 0 0 1px; 
    } 
    .navigatsioon .navbar-collapse.collapse { 
     display: none!important; 
    } 
    .navigatsioon .navbar-nav { 
     float: none!important; 
     margin-top: 7.5px; 
    } 
    .navigatsioon .navbar-nav>li { 
     float: none; 
    } 
    .navigatsioon .navbar-nav>li>a { 
     padding-top: 10px; 
     padding-bottom: 10px; 
    } 
    .navigatsioon .collapse.in{ 
     display:block !important; 
    } 
} 

Answer 2

ブートストラップ.navigatsioonを追加することで動作するようになりました。ナビゲーションバーの崩壊はCustomize page/Grid systemに

1. 移動をブレークポイントを設定して、フィールド@grid-float-breakpointあなたが必要とする値に設定変更する方法。

2. ページの下部にあるCompile and Downloadボタンをクリックします。

3. 結果のアーカイブからファイルbootstrap.cssとbootstrap.min.cssを抽出します。

4. サイトの標準ファイルbootstrap.cssとbootstrap.min.cssの代わりに使用してください。

他に必要なものはありません。