Internet Explorer (Windows) CSSバグリスト

インライン要素に指定したパディングやボーダーの上下が消える(IE6)

症状

高さが指定された要素内にあるインライン要素にパディングやボーダーが指定されているとき、パディングやボーダーの親要素をはみ出している部分が消えてしまう。

例示

<div class="example">
<p style="height:20px; border:3px solid red; font-size:18px;">
A<span style="padding:10px; border:3px solid blue;">B</span>C
</p>

span要素の上ボーダーから下ボーダーまでの高さは親要素の高さを超えています。

スクリーンショット

補足

上下部が消えるインライン要素に position: relative; を加えて指定すればこのバグを回避できます。

<p style="height:20px; border:3px solid red; font-size:18px;">
A<span style="padding:10px; border:3px solid blue; position:relative;">B</span>C
</p>

修正状況

WinIE6.0では標準・互換モードともに不具合の発生が確認されました。