0

すべて同じ幅と高さの div のセットがあります。すべてが左にフロートし、コンテナーの 50% に設定されています (コンテナーはページの幅 100% です)。一部の画面幅では、横に別の要素があるかのように、いくつかの div が 50% 以上シフトされます。

<div class="container">
<div class="pod">
<img />
</div>

<div class="pod">
<img />
</div>
</div>

ウィンドウの幅を調整すると、問題を解決できます。これは複数のウィンドウ幅で発生し、(私が見る限り) FireFox でのみ発生します。

jsfiddle で作業して、それを複製して表示できるかどうかを確認します。それまで、誰かがこれに対処して問題を発見しましたか?

-----編集-----ページ幅を変更することで、Chromeでもこれを再現できます。FireFox でより頻繁に見られます。

ボックスを 50% から 47% に変更すると、問題は解決します...

-----編集-----私がやっている「分割」が問題の原因であることがわかりました。

2 つの jsFiddles:

div が現在どのように応答するか (div の一部が「分割」されていることを忘れていました。これが今まで問題の一部であるとは思いませんでした) http://jsfiddle.net/dcp3450/xvMHR/

div が分割なしでどのように応答するか: http://jsfiddle.net/dcp3450/Xzrgv/

ネストされた「50%」が分割項目で丸めを引き起こし、それが問題の原因になっていると思います。それが本当かどうか、そして問題を解決する方法についてのアイデアはありますか?

4

1 に答える 1

0

まず、まだ持っていない場合は、Firebugを入手してください。

次に、要素インスペクターを使用して、DOM から要素を削除し始めます。テキストが分割要素の高さからはみ出す場合があるため、最初にテキストを削除してから、親要素を上に向かって進んでみてください。

(X)HTML と CSS を見ずにお伝えできるのは、これだけです。

overflow分割要素を次のように設定することもできます...

<div style="overflow: scroll;"></div>

...また...

<div style="overflow: auto;"></div>
于 2013-09-24T17:46:39.087 に答える