主に技術的なことを書くブログ

浅めにマークアップ&フロントエンドの技術的なことをメモしていましたが、ざっくばらんに書いています。

IE6で絶対配置の要素が消えるバグ

▼ヘッダーはじまり(position: relative;)
タイトル(float: left;)
ディスクリプション(position: absolute;で、タイトルの上に持ってきてる)
検索窓(float: right;)
グローバルメニュー(clear: both;)
▲ヘッダー

他の人がコーディングしたやつで、上記のようにディスクリプションをポジションつかって、ページの一番上に表示したページがあったんですが(たぶんソースをそういう順番にしたかったのか)。
なぜかIE6ではディスクリプションが消えちゃってる、なんてことがありました。

そんなときは、下記のように、

▼ヘッダーはじまり(position: relative;)
タイトル(float: left;)

■この間になんかはさむ

ディスクリプション(position: absolute;で、タイトルの上に持ってきてる)
検索窓(float: right;)

■この間になんかはさむ

グローバルメニュー(clear: both;)
▲ヘッダー

■この間になんかはさむと表示されました。


参考:
IEで絶対配置(position:absolute)のボックスが消えるバグの検証