overflowでスクロールバーが出るときの高さ計算が正しくない

症状

ある要素でoverflowプロパティにautoかscrollを指定してスクロールバーが表示されるとき、その中身の高さ計算が正しくない。最後のボックスの下ボーダーまでしか高さを確保せず、下マージンが消えてしまう。

例示

<div style="width:10em; height:5em; overflow:auto; border:2px solid red;">
<div style="margin:2em 0; border:2px solid blue;">
↑上マージン<br><br><br><br><br>↓下マージン
</div>
</div>
↑上マージン




↓下マージン

青色のボーダーのdiv要素の上下に2emのマージンを設定しています。

スクリーンショット

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

WinIE5.5WinIE5.5での表示

補足

heightプロパティの値によってはこの不具合が現れないことがあります。

IE5.0では、違ったバグが出ます。

修正状況

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

WinIE7でも発生します。

スポンサーリンク

関連記事

スポンサーリンク

<演算子 小さい

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

上に戻る