IE6でmin-Widthやmax-heightを適応させる

前回のエントリー「ヘッダーとフッターを固定して、PNGの透過画像を用いて立体的に見せる（IE6対応）」でヘッダー・フッターを固定させるレイアウトを作ったのだけれど、どうせならリキッドレイアウトにさせようと思い。width:100%でカチャカチャ作っていた。

で、ヘッダーとかにfloatのleft,rightでパーツをレイアウトしていたのだけれど、
ウィンドウを極端に小さくした場合floatしたパーツが崩れてしまうことがある。

と言うわけで、min-widthを設定しようと思い「#header {min-width:800px}」などと書いていたのだが、IE6ではこの設定が効かない！

長い前書きですが、そんなこんなでIE6でmin-Widthやmax-heightを適応させる方法です。

IEの独自設定でexpressionを使います。

* html #header {
    width:expression(document.body.clientWidth < 800? "800px" :document.body.clientWidth > 2000? "2000px" : "auto");
}

以上の記述で、「#header {min-width:800px;max-width:2000px;}」のような設定をIE6にも適用することができます。
widthの所をheightに変えればmin-heightやmax-heightなどの設定もできます。

そんなかんじ。