マージンに負数が指定された要素でボーダーがずれてゆく

症状

垂直方向のマージンに負の値が指定された要素を含む、要素のボーダーや背景が本来の位置と外れた場所に表示される。

例示

<div style="border:2px solid red;"><div style="margin:-1px;">A</div></div>
<div style="border:2px solid blue;"><div style="margin:-1px;">B</div></div>
<div style="border:2px solid green;"><div style="margin:-1px;">C</div></div>
<div style="border:2px solid maroon;"><div style="margin:-1px;">D</div></div>
<div style="border:2px solid navy;"><div style="margin:-1px;">E</div></div>

それぞれのdiv要素のボックスは上部が1pxずつ重なって表示されます。

スクリーンショット

Moz1.0Moz1.0での表示(標準モード)

WinIE6WinIE6.0での表示(標準モード)

修正状況

WinIE6.0では標準・互換モードともにボーダーのずれが発生します。

スポンサーリンク

関連記事

スポンサーリンク

XOOPS Cubeのインストール

ホームページ製作・web系アプリ系の製作案件募集中です。

上に戻る