32

Twitter Bootstrap をいじっていた.rowところ、画面の長さよりも幅が広いことに気付きました。

これが例です

ブートストラップ 3.0 が出たとき、私はこれを経験しませんでした。

右側の余分なスペースはmargin-right: -15px;

私はこれを何時間も睨みつけてきましたが、なぜ、またはどのように自分をだましているのかについて何の進歩も見られず、検索は役に立ちませんでした.

私は明らかなことを見逃していると確信しています。ウィンドウ幅を超えてこのスペースがある理由（スクローラーを強制する）と、それを回避する方法を理解したいと思います。行が 100% 一致すると思っていた

4

5 に答える 5

48

正しい解決策 ( https://getbootstrap.com/docs/3.3/css/#grid-example-fluid ) はcontainer-fluid、周囲の div でクラスを使用することです。

<div class="container-fluid">
  <div class="row">
    Content
  </div>
</div>
于 2014-05-12T18:41:54.713 に答える
8

ブートストラップの .row から margin-left と margin-right を削除し、幅を 100% に設定するだけで修正しました

于 2014-06-04T04:07:22.160 に答える
7

編集 >>

これは以前に受け入れられた答えでした。古いバージョンのサイトがある場合は、元に戻します。

編集 <<

バグです

これはしばらくの間修正されていないようです。おそらく3.1で適切に修正されるでしょう。

最良の提案は要素にあるよう"overflow-x: hiddenですbody。

https://github.com/twbs/bootstrap/issues/10711

それ以外は、このコミットでその一部を追加/明確化しました

特にこの行は、 「完全に流動的なレイアウト (サイトがビューポートの幅全体に広がることを意味する) を作成しようとしている人々は、使用されている要素をオフセットするために、グリッド コンテンツを含む要素でラップする必要があります」padding: 0 15px;margin: 0 -15px;.row

于 2013-10-27T01:35:21.900 に答える