最近はブログのコーディングを勉強がてらよくやってるんですが
下方に置いてある検索ボックス(divで囲まれた部分)を絶対配置(position:absolute)で
最上段の右上に持って行こうとしてみたら
IE6、しかもIE7までがきれいにそのボックスだけ表示されない。
Firefox,Opera,Safariなどなどは全部OKなのに、IEだけがダメ。
「またかこのボケエエ!!!!IEィィィィィィッ!!」とか悪態ついたかどうかは
まあ上品なボクの事だからないとしてですねw
ちょっとこれはこまったぞ、と思って検索してみたらとてもよいまとめ記事がありました。
「IEで絶対配置(position:absolute)のボックスが消えるバグの検証」
http://jmblog.jp/archives/180
おおう!これはまさに今起こっている現象!
どうやらfloatとClearの条件が合致すると、この現象が起こるようです。
○ position:absolute が float と hasLayout をもつ clear の直前に存在する場合。
○ position:absolute が float と hasLayout をもつ clear との間に存在する場合。
○ position:absolute が width:100% の float の直前に存在する場合。(IE6以下のみ)
○ position:absolute が width:100% の float の直後に存在する場合。(IE6以下のみ)
とても丁寧に検証と対処法が書いてありました。
http://jmblog.jp/misc/disappearance-of-an-absolute-positioned-box-in-win-ie/index.ja.html
今回の場合、消えたボックスをdivで囲む事によってこの現象を回避できました。
ほんとIE様にはいつも振り回されますね・・