Home > Windows > Internet Explorer > ver.6 親にボーダーを設置した要素を持つ要素のマージン設置が正しくない

親にボーダーを設置した要素を持つ要素のマージン設置が正しくない

ボーダーが設置されている親要素を持つ要素にwidthプロパティまたはheightプロパティを具体的な値で指定したとき、その要素に指定したマージンが正しく設置されない。

  • WinIE6.0標準モード:上マージンと左マージンを(おそらく右マージンも)設置しない。下マージンは親要素の下マージンであるかのように設置される。
  • WinIE6.0互換モード、WinIE5.5:上のマージンを設置しない。下マージンは親要素の下マージンであるかのように設置される。

例示

<div style="margin-left: 3em; border:2px solid blue;">
    <div style="margin-left:-3em; width:50%;">Top</div>
</div>
<div>Bottom</div>
Top
Bottom

div要素が入れ子になっている部分では親要素に3emの左マージン、子要素に-3emの左マージンを設置しているので、文字列「Top」と「Bottom」の縦方向の位置はほぼ揃っているはずです。

スクリーンショット

Ns7.1Netscape7.1標準モード

WinIE6.0WinIE6.0標準モード

修正状況

WinIE6.0の標準モードと互換モードで不具合の発生を確認しました。

Home > Windows > Internet Explorer > ver.6 親にボーダーを設置した要素を持つ要素のマージン設置が正しくない

Search
オススメ書籍
Feeds

Return to page top