IE6問題への対処に関するテクニックをまとめた記事を紹介する記事を紹介します。 😉
(以下、まとめの抜粋)
- 必ず『DOCTYPE』を指定する。指定はHTML 4.01を採用する場合もXHTML 1.0を採用する場合もStrictを用いることが望ましい
- 不可視化や狂ったボックス配置といった多くの問題を避けるために『position:relative』を使うようにする。絶対位置指定を使う場合には子ノードの位置を注意深く確認すること
- マージン指定のあるフローティング要素でおこる”IE6ダブルマージンバグ”を回避するため、『display:inline』を使うようにする
- IE6のレンダリング問題を解決するために『hasLayoutプロパティ』を設定する
- フローティング要素に配置された最後の方の文字列がおかしくなる問題に対処するために『フローティング要素でdisplay:inlineを使 う』『最後のフローティング要素でmargin-right:-3pxを指定』『フローティング要素の最後のアイテムとして条件付きコメントを指定する』 『コンテナの最後の要素として空のdiv要素を指定する』といった対処を実施する
- IE6はCSSホバー効果をa要素にしか適用できない。クリック可能部分やホバー効果を持たせる要素にはa要素を使う
- IE6に特化した指定をおこなうために!important指定を使ったり、Advanced Selectorを使う
- パーセント指定はIEでは混乱をきたすため避けるようにする
- 完成するまでIE6で試験を行わないと修正に長い時間がかかる。早期にそして頻繁に試験をおこなうべき
- コードのリファクタリングを実施する
概ね知ってたけど、一部知らなかったこともあったり(汗)
例えば 4 の『hasLayoutプロパティ』。
早速調べてみたら、コリスさんのところでど真ん中の記事発見。
ふむふむ。
私は、今までこの問題に悩まされたことはあまりなかったですね。
IE でレイアウトに問題が起こったら、まず width 値を設定することにしているので(大抵はこれで解決できる)、この hasLayout を意識せずにすんだということでしょう。
尚、次期 IE のバージョン8では、このプロパティがなくなるそうです。
なくても CSS 対応の不具合によるレイアウト崩れがなくなったから、というのが原因のようで。
IE8 は概ね歓迎できそうな雰囲気ですね。
IEは、セキュリティソフトのように、バージョンアップしなかったら常に警告アイコンが表示されるようになるなど、「バージョンアップするのが当然。しないのは自己責任。(=旧バージョンではレイアウトが崩れても当然)というような対応をしてもいいと思う・・・。