BloggerのテンプレートがIEで崩れるバグを修正しました。

先日の話

相互リンクをしているブログ「お財布にやさしい 魚＆サンゴ水槽日記」の運営をされているあくあ１２さんより、IEでサイトを表示するとレイアウトが崩れているというご連絡をいただきました。

私は普段、ブラウザはGoogleChromeを使っているのでまったく気がつかなかったのですが、実際IEで開いてみたところ、3カラムレイアウトの両サイドがなぜか記事下に表示されてしまうというバグが発生＾＾；

カラム落ちってやつですね。

また、どうもIE９で表示すると他にも余白や文字の大きさの表示でバグがある模様＾＾；

結論から言うと以下の2点の修正で直りました。

１.Bloggerのテンプレートに標準で記載されているIE互換のタグを修正

テンプレート ⇒ htmlの編集 ⇒ 続行

htmlの編集画面で下記項目を修正しました。

(修正前）
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
（修正後）
<meta content='IE=EmulateIE7; IE=EmulateIE8' http-equiv='X-UA-Compatible'/>

これで、IE8,IE9に対して、互換表示がされるようになります。


2.記事内のJAVAスクリプトを修正

1の対処でカラム落ち意外のバグは直りました。

しかしカラム落ちは直らず、原因を探ると。9月12日にアップした「シアノバクテリア（赤コケ）とのあくなき戦い」以降の記事でカラム落ちがあり、その前の記事は無事だった。

どうやら記事内に書いたJavaScriptがカラム落ちの直接的な原因だったようです。

ということで、該当記事のJavaScriptをもう一度貼りなおしたところ、直りました！

あくあ１２さん連絡ありがとうございました！


最後まで読んでいただいてありがとうございます！
ついでに、下記をクリックして応援していただけると幸いです。