Twitter bootstrapのページ右側にある白い隙間

Twitter Bootstrapを使用したレスポンシブスタイルシートに問題があります。サイトは問題なく表示されるのですが、なぜかレスポンシブ・タブレットとスマホでは、ページの右側に大きな白い隙間ができてしまうのです。スクロールバーの問題ではなく、巨大な白い隙間です。

http://i.imgur.com/JeRRRqq.png

このページでは、あまり多くのことを変更していないつもりです。幅も何も変えていません。Chromeでオブジェクトを検査しても、幅方向にはみ出るようなものは見当たりませんでした。

プログラミング
css layout twitter-bootstrap
23日 5月 2013 в 2:51
14 ビュー

試してみましたか？

html, body { overflow-x: hidden; }

フィドルを投稿できますか？

解説 (6)

HTMLに以下のmetaタグを追加してください。

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=320, height=device-height, target-densitydpi=medium-dpi" />

また

html, body. div{
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
}

をhtmlとbodyに設定してみてください。

Scott Selby
編集した答え 12日 11月 2014 в 7:09
解説 (6)

一般に、このような現象は、設定したコンテナの幅の境界を壊しているdivがあるために起こります。divやセクションのpadding, margin, positioningなどが考えられます。

解説 (0)