2

tb Webサイトの例のメニューバーを全体を通して一定の高さにしようとしていますが、少し奇妙な動作に遭遇しました。

次のデモでは：

http://twitter.github.com/bootstrap/examples/fluid.html

ブラウザのサイズを約1070/1080ピクセルの幅に変更すると、バーは醜い高さにジャンプしてから下に戻ります。これは、レスポンシブcssのどこかに、ブラウザ幅の最大2pxの範囲を考慮していないメディアクエリがあるかのようです。私はこれをアプリケーションのベースラインとして使用しており、これを修正する方法についての提案を絶対にいただければ幸いです。

4

2 に答える 2

2

この問題は、ページ固有のスタイル（fluid.htmlから）に起因します。

@media (max-width: 980px) {
    .navbar-text.pull-right {
        float: none;
        padding-left: 5px;
        padding-right: 5px;
    }
}

対いくつかの外部CSS（bootstrap-sensitive.cssから）：

@media (max-width: 979px) {
    .nav-collapse .nav {
        float: none;
        margin: 0 0 10px;
    }
}

ご覧のとおり、これらのメディアクエリには1pxの違いがあります。最初に979pxも使用するように編集した場合、それ以上ジャンプすることはありません。

于 2013-03-19T19:34:35.760 に答える
0

そこに.navbar-text.pull-right行く{float: none}前に.nav-collapse行く場所があり{height: 0}ます。私はそれを探します。

更新：それはページスタイルにあります：

  @media (max-width: 980px) {
    /* Enable use of floated navbar text */
    .navbar-text.pull-right {
      float: none;
      padding-left: 5px;
      padding-right: 5px;
    }
  }
于 2013-03-19T19:29:44.540 に答える