IEでの互換表示設定とhtmlのMETAタグでのX-UA-Compatible設定の違い
-
2012年1月18日 6:03IE9ででIE7標準のhtmlを互換表示させるためにMETAタグに以下の設定を入れています。
<META http-equiv="X-UA-Compatible" content="IE=7" />
ところが、ブラウザで「互換表示設定」を行うのと、上記metaタグに互換設定を入れるのとで、表示が異なる場合があります。
具体的に把握できたのは以下になります。
1.cssのスタイルをclass=で設定した場合に、「互換表示設定」ではclassに指定したstyleの大文字と小文字は区別していないようですが、METAタグで指定した場合には大文字と小文字を区別する
2.styleにwidth="10"などpxなどの単位を指定しなかった場合に、「互換表示設定」では自動的にピクセルとみなされるが、METAタグで指定した場合にはサイズ設定自体が無効になる
質問
ブラウザでの互換表示設定とhtmlのMETAタグでX-UA-Compatible設定を行った場合の相違点をご教授いただきたいです。- 編集済み miyavig 2012年1月18日 6:16
すべての返信
-
2012年1月18日 8:33
X-UA-CompatibleにはIE=7という指定とIE=EmulateIE7とがあります。IE=7はHTML内の記述に依らずIE7相当の描画をします。それに対しIE=EmulateIE7はIE7の判断ロジックを使用してIE7相当の標準準拠モードもしくはIE5相当のクアークスモードのどちらかを選択します。
そして互換表示ではIE=EmulateIE7相当だったかと思います(あやふや)。
アドレスバーに javascript: alert(document.documentMode) を入力し何が表示されるかを確認してみてください。モードに応じて 5 / 7 / 8 / 9などの数値が得られることでしょう。 ドキュメント互換性の定義
- 回答の候補に設定 佐祐理 2012年1月18日 12:24
- 回答としてマーク 田中夢Moderator 2012年1月30日 2:05
-
2012年1月18日 10:09
ご返信ありがとうございます。
javascript: alert(document.documentMode) を入力して確認してみました。
問題が起きている画面でX-UA-CompatibleにはIE=7と指定した場合には"7"と表示され、
X-UA-Compatibleを指定しなかった場合で互換表示設定をした場合には"5"が表示されました。
また、X-UA-CompatibleにIE=EmulateIE7を指定した場合には"5"が表示されたことから、互換表示設定と同様の効果を得るためには"EmulateIE7"を指定するのが正しいことがわかりました。
適切なご回答と調査方法のご連携、ありがとうございました!
-
2012年1月18日 12:24
X-UA-Compatibleを記述しないのがベストかと思います。先に説明したようにIE5相当のモードで動作しています。これはX-UA-Compatibleが導入される以前のIE6やIE7に於いても同じです。そしてX-UA-Compatibleを記述しなかった場合のIE8以降に於いても同じです。であればX-UA-Compatibleを記述しない方がいいかと思われます。
# もちろんそんなことよりCSSスタイルクラスを正しく大文字小文字を区別して記述しpxを省略しないなど、標準に準拠した記述をすべきですが。
- 回答としてマーク 田中夢Moderator 2012年1月30日 2:05
-
2012年1月30日 2:04モデレータ
こんにちは。
フォーラム オペレーターの田中夢です。
佐祐理 さん
いつも参考になるアドバイスをありがとうございます。
miyavig さん
最後に投稿されてから少し経過しましたが、その後 佐祐理 さんの投稿をご覧になっていただけましたでしょうか?
今回のご質問につきましては、佐祐理さんからのアドバイスを参考にしていただけたようですので、勝手ながら私のほうで [回答としてマーク] とさせていただきますね。
また何かありましたら、MSDN / TechNet フォーラムをご利用くださいね。
---------------------------------------------------------------------
日本マイクロソフト株式会社 フォーラム オペレーター 田中夢

