12

ツイッターブートストラップを使用して次のナビゲーションバーコードがあります

<div class="navbar navbar-inverse">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
      </ul>
    </div>
  </div>
</div>

そして、出力は 次のオリジナルのブートストラップ付き ようになります。bootstap.cssの「.navbar.container {width：auto}」から「width：auto」を削除する と、出力ハック後 は期待どおりの出力になります。

https://github.com/twitter/bootstrap/issues/2093は、意図された機能として「width：auto」を示しています。ここで何が間違っているのですか？

4

4 に答える 4

14 
<div class="navbar navbar-static-top navbar-inverse">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
      </ul>
    </div>
  </div>
</div>

これでできるはず

于 2013-04-10T21:57:19.847 に答える
2

上記の問題に対する別の解決策を見つけました。

navbar-fixed-topクラスをメインnavbardivに追加します。

そして追加

.navbar-fixed-top{
position: relative;
}

あなたのCSSルールに。

これにより、メニューが左に引っ張られるのが制限され、ワー​​ドプレスのテーマを開発している間は問題なく機能しました。

于 2013-06-10T11:47:23.923 に答える
0

Bootstrap の基本的なナビゲーション バーの例を見ると、ナビゲーション バーの両側に余白があることがわかります。これは、非流体コンテナの場合、ページが固定幅を占有し、navbar がその幅を使用するためです。

ナビゲーション バーをページ全体に広げたい場合は、 を使用する必要がありますclass="container-fluid"が、流動的なレイアウトでは、メニュー項目 (既定では) はページの左側から流れます。

コードでは、両方を使用しておりcontainer、container-fluidどちらが間違っています。Bootstrap のドキュメントに従って、nav タグにコンテナーを埋め込むのではなく、nav をコンテナーに配置する必要があります。

于 2012-12-10T10:34:37.300 に答える
0

width: autoから定義を削除することでこれを解決し.navbar .containerましたbootstrap.css。

理想的な解決策ではありませんが (編集bootstrap.css全般)、すべてのレスポンシブ幅をセレクターに適用するよりもはるかに簡単でした。

于 2013-04-05T09:06:59.487 に答える