overflow:auto; を指定した要素の下に空白ができる

症状

overflow:auto; を指定した要素をbody要素内の最後に置いた場合、内容物から導かれるボックスの高さ(height:auto; を指定したときの高さ)と現在のボックスの高さとの差にあたる大きさの余白がその要素の下部に出現する。

例示(ソース)

<body style="margin-bottom:0; padding-bottom:0; border-bottom:2px dashed blue;">

<div style="margin:0; overflow:auto; width:10em; height:4em; background:lime;">
内容<br>内容……</div>
</body>

overflow:auto; を指定したdiv要素をこの文書の最後に置いています。この文書の下端に余白は発生しないはずです。

スクリーンショット

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

修正状況

MacIE5.1〜5.2で不具合が発生するそうです。


例示(実際の表示)

内容
内容
内容
内容
内容
内容
内容
内容
内容
内容

スポンサーリンク

関連記事

スポンサーリンク

サイズの大きいフロートの上に空白領域が発生する

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

上に戻る