web-dev-qa-db-ja.com

これらのTwitter bootstrap 3つのナビゲーションバーリンクを中央に配置するにはどうすればよいですか?

bootstrap 3のナビゲーションバーメニュー項目を中央に配置するにはどうすればよいか疑問に思っています。.nav-justifiedクラスが含まれていることはわかっていますが、使用するとnavbar-navと競合します。一緒に。開発チームによって調査されていると思います。

それで、CSSを使って回避策があり、それが入っているコンテナーのサイズが変更された場合でも、ナビゲーションバーのメニュー項目/リンクを正当化するナビゲーションバーを実現できます。

これが Jsfiddle 必要な場合に役立ちます。

11
Ashley Brown

.nav-justifedクラスはnav-tabs/nav-pillsbootstrap docs を参照)で使用され、nav-barでは使用されません。 2つの概念は非常に異なり、混同しないでください。

ただし、次のcssを追加することで、探している効果を実現できます。

.navbar-nav.nav-justified > li{
    float:none;
}

nav-justifiednavbar-navでうまく機能します:

<ul class="nav navbar-nav nav-justified">

更新されたjsFiddle を参照してください。

28
edsioufi

LESSを使用する場合は、次の操作を実行できます。

.navbar-nav {
  .nav-justified;
}