IE対策:互換表示させない。

  • 138
    Like
  • 0
    Comment
More than 1 year has passed since last update.

IEのバージョンごとにレンダリング方法が変わり、
互換表示と標準表示方法があるやっかいなIEの対策。

IEでWebページを正しく表示できない場合に、
互換モードになっていることが多いです。

常に標準モードになる<meta>タグを入れておくようにします。

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

上記を、

  1. <head>内に入れる。
  2. cssやjsファイルが記述されている箇所の前に入れる。
    (外部のファイルの読み込みがあるとそこで表示モードが決定してしまうそうです。)

content="IE=edge"はIEの最新バージョンの標準モードを表しています。
IE7を使用している場合は、IE7、IE10を使用している場合はIE10のレンダリングモードで表示されます。

IE7であろうが、IE11であろうが、
IE8のレンダリングモードにしたいときは、
content="IE=8"という風に指定もできます。

IE11 

キャプチャ_.PNG

IE11のドキュメントモードの既定値はEdgeです。

IE10のドキュメントモードが最後の新しいドキュメントモードになり、
IE11からは、Edgeモードになりました。

IE10以前のブラウザ環境で、
互換させたいときは、これまで通り<meta>タグでサポートします。

参考

IEに互換表示をさせないX-UA-Compatibleの指定
http://www.loconoco.info/?p=665

IE=edgeが効かない場合の対処法
http://www.useful-notes.com/others/ie-edgenotvalid/

IE8以降のバージョンでレンダリングモードをmeta要素で指定する時のまとめ
http://mj-wave.com/post-714/

Web制作者は注意! Internet Explorer 11で変更された「互換性」
http://www.buildinsider.net/web/ie11attention/01