【備忘録】IEで絶対配置（position:absolute）のボックスが消えるバグ
2017/01/12
IE6だけ表示されない現象
IE6でposition:absoluteのボックスがごっそりと消えてしまう（見えない）
バグに遭遇してしまい、
かなりの時間をかけて調べたところ
なんとか修正できました。
FireFox2、FireFox3、IE7、IE8
では表示されていましたのでIE6独自のバグです。
試したこと
zoom:1や、z-indexプロパティ
も試してみたのですがだめでした
参考にさせていただいたサイト
- position:absolute が float と hasLayout をもつ clear の直前に存在する場合。
- position:absolute が float と hasLayout をもつ clear との間に存在する場合。
- position:absolute が width:100% の float の直前に存在する場合。（IE6以下のみ）
- position:absolute が width:100% の float の直後に存在する場合。（IE6以下のみ）
position:absolute が width:100% の float の直前に存在する場合。（IE6以下のみ）
今回は上記の現象でした。
Win/IEで絶対配置（position: absolute）のボックスが消えるバグの検証ページ
こちらの検証ページを参考に
IE6用にdivを追加してfloat をボックスで囲みました。
そもそもこうなったのは納品後にヘッダに要素を追加してほしいってなって
余計な要素が増えたせいなんです。（よくある話）
だからはじめらから要素を決めておかないと整合性が取れなくなるっていったんですよ。
お客様は神様だけど、言ってること鵜呑みにしないで、
ちゃんと意見言うようにしよう。
反省