カテゴリー
オープンソース システム関連

IE11でレイアウトが崩れたときの覚え書き

今、サイトをBaserCMSの上でTwitter Bootstrapで作っています。普段使っているChromeとFirefoxで確認しながら、ようやく完成というところでIE11で確認したところ、見事にレイアウトを崩れています。いつもの通り、このIEめが、とムッキーとなります。このままIEは非対応ということもできないので対応方法を探ります。

HTML1202: http://hoge/ は、[イントラネット サイトを互換表示で表示する] がオンであるため、互換表示で実行中です。

と表示されています。今、テストしているサイトは、Vagrantで開発環境を作っているので、イントラネットなのでしょう。では互換表示をオフにするにはどうすればいいのでしょう。

そういえばIEは互換モードなんてありましたが、IE11ではその切り替えのアイコンがなくなっています。行き当たったサイトに書いているように、11の「ツール」メニューの「互換表示設定」で互換モードをオフすることができます。

ie11

これで見事にレイアウトの崩れが直っていました。まあ、本番サイトではイントラネットとはならないので、正常に表示されると思いますが、やはりIEには落とし穴があります。

IE12,13・・・になったらいちいち書き換えなければいけないの? となりますので、これは書かなくもいいでしょう。

追記(2020年8月27日)

まだGoogleさんに聞いてこの記事にたどり着く人がいますけど、この記事は非常に古いのです。今となってはIEのサポートは、おかげさまで打ち切りとなりましたので、こんな苦労をしなくてもよくなりました。喜ばしいことです。

IEが動かない、と言われても、「IEはサポート外だから、これからはEdge(Chromium対応)ですよ」と言ってやりましょう。その前に案件の契約のときに、サポートするブラウザからIEを忘れずに外しましょう。昔の契約でIEが残っていたら、ぜひとも外すように交渉しましょう。