昨日書いた[IEで2カラムレイアウトの表示]で、IEではfloatよりもposition : absolute;で配置してしまった方が安定すると悟ったのでここでも似たような記述にしてみました。
しかしやってみてから、どうして今までpositionプロパティではなくfloatに拘っていたのか、その理由を思い出しました。
position : absolute;で配置されたブロック要素って、簡単に言うと無い物として扱われ、それ以外の要素を全部表示してから、指定位置に表示するようなカタチになるんですよね。
だから、最後にwidth:100%のフッタを挿入しても、記事が短い場合absoluteで配置したメニューの下に配置されないで、記事の下に表示されメニューと重なって表示されてしまいます。
んー。どうしたらいいんだろう。
今まで通りIEを無視したCSSでもいいならfloatに戻すんだけど、せっかくIEでもそれなりに表示出来るようにしたのに何となく勿体ない。
仕方がないので、なにか良い方法が思い浮かぶまでフッタの左マージンをサイドメニュー分だけ取っておきます。フッタが最後尾に表示されないってのは格好悪いけどね。
フッタもposition : absoluteでbottom:0pxとか‥やっても無駄なんだよね、たしか。
----
余談ですが、ウインドウ幅を極端に小さくしても問題なく表示するように、全体をrelativeで配置したブロック要素で囲ってからサイドバーをabsoluteしたら、IEでとんでもない位置に表示されたので、これは保留。
そーいえばIEってmin-widthもダメなんだよね。
IEってほんとにつかえねー
----
やっぱりfloatでの配置に戻しました。
IEではウインドウサイズを小さくし過ぎると右側のブロック要素が下に落ちますが知ったことではありません。