min-heightをIE6で

久しぶりの更新です^^;
通常はそこまで多用するプロパティではないんですが、たま〜に必要になった
ときになかなか重宝する、バグを利用したIE用のハックをご紹介します。
では実際にやってみます。

• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • -

<div style="background-color:#CCCCCC;min-height:100px;">
<p>テキストテキストテキストテキストテキストテキスト</p>
</div>

• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • -

とすると、下のような表示になります。

テキストテキストテキストテキストテキストテキスト

firefoxやIE7では背景色のついたボックスが100pxで表示されているはずです。
ところがIE6だとmin-height:100px;の指定が無視されてしまいます。
（中途半端に反映されるかも？）

そこで_heightというプロパティを使います。

• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • -

<div style="background-color:#CCCCCC;min-height:100px;_height:100px;">
<p>テキストテキストテキストテキストテキストテキスト</p>
</div>

• • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • • -

テキストテキストテキストテキストテキストテキスト

これでIE6でもmin-heightが適用されましたね^^
ただ動作確認できているのがIE6、IE7、Firefoxのみなので、ご利用は自己責任でm(__)m