久しぶりにドツボにハマっていました。
IE8.0やFirefoxでは正常に表示できるのに、IE7.0、IE6.0ではサイトデザインが崩壊しまくってしまうという症状にブチ当たりました。どうやらスタイルシートが反映されていないようで、ただ巨大な文字だけが画面いっぱいに出てくる始末。
色々と検索して出てきた事例として、
1. IEは31個までしかスタイルシートを読み込めない
2. Lightboxを導入すると、IEではJavaScriptファイルを読み込む際に死ぬ
ということ。
まず、1番について検証を始めてみたのですが、どう考えてもサイトで使われているCSSファイルは最大でも5個ぐらいしか見あたりません。もし制限数をオーバーしているのであれば数を減らせば復活するはずなのですが、数を減らしても一向に改善される様子がありません。というわけで、1番の事例は違うという結論に。
次に2番の問題に関してですが、結論から言えばこの問題は今回の問題の原因ではなかったのですが、IEで読み込むとこの症状が出ることが判明しました。解決策としては、Lightboxで使用するprototype.jsをはじめとしたJavaScript群を</body>付近に移動させるということです。つまり、ページ読み込みの初期のタイミングでJavaScriptファイルを読み込みすぎることでエラーになっていたのです。
さて本題のスタイルシートがIE7、IE6で効かなかったという問題の結論は......
余 計 な 文 字 が 1 文 字 入 っ て い た
これはもう笑うしかない......。
アホなバグ取りに付き合ってくれたSt.Luteさんには感謝!
激しく疲れたけど、妙に勉強になった1日でした。
コメント (2)
余計な一文字<ありがちな罠w
お疲れ様です。
おいらはもう、CSSやらXMLやらHTMLを自力で打つ体力が
ないよう…
あ、ちなみに、Safariではまったくレイアウト問題無しであります。
Posted by: ボブ | 2009年12月14日 16:31
日時: : 2009年12月14日 16:31
おお、Safariでもいけたか。
Win機しか持ってないのでMacで動作検証をしてくれるとありがたい~。
Posted by: Minea | 2009年12月14日 23:24
日時: : 2009年12月14日 23:24