更新中。

IE11でHTML5デザインが崩れる現象を対策する「x-ua-compatible」

HTML5でコーディングしたサイトをIE11で確認してみたら、デザインがグチャグチャになっていたという現象が相次いでいるようです。

・他の人と同じIE11を使っているのに自分だけ表示が崩れてしまう
・エラーが一つも見つからない

上記のような”エラーでないエラー”に悩まされているWEB制作者の方、「x-ua-compatible」の確認はお済みでしょうか?

x-ua-compatibleで一発解決!

headタグ内に以下の1行を追加してください。

これはIE10表示モードでページを表示させる機能を持ちます。IE10以外のバージョンも指定することができますので、以下にその一覧を掲載します。

なぜデザイン崩れが発生したのか

IE11のブラウザ設定で表示モードを何らかの操作によって、意図せずIE8やIE7に変更してしまっていたからだと思われます。過去のIEの表示モードを確認できるようになったことはWEB制作者にとっては嬉しい限りですが、一方で意図せず表示モードを変更してしまったユーザーにとっては迷惑でしかありません。ですので必ずWEB制作者はHTML側で「x-ua-compatible」を設定し、ユーザーの表示モードを統一するようにしましょう。IE11の出現によって、WEB制作者のチェック項目がまた一つ増えることとなりました。

執筆者Writer

AnTytle

2014年頃にAnTytleを設立。当初はプログラミング記事を書いていたが、2016年にYouTubeチャンネルのゲーム動画がヒットし、以来ゲーム分野にピボットした。

コメントComment

ログインするとサムネや名前を表示できます。