Internet Explorer (Windows) CSSバグリスト

フロートの上部に祖先要素の上ボーダーを表示する(5.x/6.0)

症状

line-heightプロパティの値が大きいとき、フロートの上部に祖先要素の上ボーダーが表示されてしまう。

例示

<dl style="border: 2px solid red; line-height:1.3;">
<dt>定義</dt>
<dd>説明</dd>
<dt style="border-width:0; float:left; width:5em;">フロート</dt>
<dd>説明</dd>
<dt>定義</dt>
<dd>説明</dd>
</dl>
定義
説明
フロート
説明
定義
説明

2番目のdt要素をフロートにしています。このdt要素にボーダーは設置していません。

スクリーンショット

Ns7.1Netscape7.1標準モード

WinIE6.0WinIE6.0標準モード

補足

親要素または祖先要素に背景を指定することでこの不具合を回避することができます(transparent値は不可)。

<dl style="border: 2px solid red; background-color:white; line-height:1.3;">
<dt>定義</dt>
<dd>説明</dd>
<dt style="border-width:0; float:left; width:5em;">フロート</dt>
<dd>説明</dd>
<dt>定義</dt>
<dd>説明</dd>
</dl>
定義
説明
フロート
説明
定義
説明

修正状況

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