スキップしてメイン コンテンツに移動

IE7で後方互換モードを使う、ドキュメントタイプスイッチについて

IE5.5 以降で対応していない CSS2 以降については、CSS Expressions を使ってやると javascript を使わなくてもなんとかなったりします。(但し、javascript が無効だと CSS Expressions も動かない!)

そんな CSS Expressions ですが、IE7と8では後方互換モードでないと動作しません。

その理由はIEだって結構 CSS サポートしてるんだぜ、とのことですがその割には、便利な CSS を非サポートだったりします。例えば<a> タグ以外への :hover:target とか。

そこで、IE8やIE7でも適宜に後方互換モードになるようにドキュメントタイプスイッチしてやる必要があります。

まず、IE8ですがこれは <meta> を使用する簡単な方法が用意されています。こんな感じのを <head> 内に入れてやるだけでスマートです。

<meta http-equiv="X-UA-Compatible" content="IE=5"/>

続いてIE7ですが、きちんと XML 宣言してやると後方互換モードに突入する、といったIE6のようなこともありません…

最初は条件付コメントでやったりしましたが、本日ぐぐってみるとちょうどいい記事が見つかりました。

XML 宣言の中の区切り文字が通常半角スペースなのをタブにしてやると、IE7だけうまい具合に後方互換モードになってくれるとのことです。

CSS だけで動く LightBox を自分でもやってみたいのですが、このIE7の後方互換モードをうまくコントロールできなくて長々とお蔵入りにしていました。