CSS Radar

Min-height & Min-width IEバグFix

IE(IE7も含む)にはmin-height、min-widthという非常に便利な属性が存在しない。
ボックスモデルバグをはじめとするIEの数々のバグの中でもかなりやっかいなバグであることは間違いない。

とくに動的なサイトを構築する際に、ある特定のブロック要素を最低でも×px以上確保しておきたいという場合など、
min-heightが活躍する場面は枚挙に暇がない。

そんな便利なmin-height、そしてついでにmin-widthの属性をIEでもきちんと設定できるようになるバグFixを紹介。

とても簡単なバグFixなのでちょっと拍子抜けするかもしれない。

selector {
  min-height:500px;
  height:auto !important;
  height:500px;
}

コードの説明を加える必要もないくらいシンプルな方法だ。
min-heightを設定したい要素に上記のように設定してやればOK。
もちろん、高さの指定は自由だ。

min-widthのほうもまったく同じ

selector {
  min-width:500px;
  width:auto !important;
  width:500px;
}

参考サイト
Min-Height Fast Hack