ブラウザの解釈対策（Windows IE 5.x編）
2005年12月 4日
この問題は、現在でもWindows版IE 5.5 などを利用されている方がいるため、あまり無視することができません。
そこで、今回は、 ブラウザによる解釈の違いを回避する方法（Windows版IE 5.x編）について説明します。
まずは、Windows版IE 5.x対策として、最も有名な回避方法を紹介します。
■ Box Model Hack（ボックスモデルハック）
この回避方法は、Tantek Celik氏が見つけ出したもので、Windows版IE 5.xにあるCSSのバグを利用したものです。
具体的には、IE 5.xでは理解することができないCSSプロパティ（voice-family）を記述し、その前後に、IE 5.x用、6.x用の数値を記述する方法です。
＜CSS の記述例＞
| #sample { margin: 10px; padding: 10px; border: 2px solid #000; /* 古いIE用の幅（コンテンツ幅＋ボーダー幅＋左右パディングの幅） */ width: 400px; /* ボックスモデルハック */ voice-family : "\"}\""; voice-family : inherit; /* モダンブラウザ用のコンテンツ幅 */ width: 376px; } |
IE 5.xでは、voice-familyプロパティを上手く読み込むことができないため、途中で#sampleのスタイルの読み込みを終了してしまうというバグがあります。
このバグを利用することで、IE 5.xでは、voice-familyプロパティの直前に記述されたwidthの数値までを読み込みます。
モダンブラウザでは、IE 5.x用のwidthの数値を読み込んでも、voice-familyプロパティの下にあるwidthの数値を読み直しますので、新旧のブラウザで正しい数値を読み込むことができます。
[参考記事] Box ModelHack
[参考記事] Box ModelHack（邦訳）
[次の講義へ] ブラウザの解釈対策（Opera編）
参考になりましたら、応援お願いします。
パーマリンク | 投稿者 りっち | 2005年12月 4日 20:57
| 
| 
はてなブックマークに追加
Yahooブックマークに登録
関連記事
トラックバック
このエントリーのトラックバックURL:
コメント
これまでに他のブログ上で電子書籍やゲストのオーサリングを作成する方法について考えたことがありますか？私はあなたが議論する同じトピック上に基づいてブログを持っており、いくつかの物語/情報を共有することを心よりお待ちしています。私は私の訪問者があなたの仕事を楽しむでしょうね。あなたがさらにリモートで興味を持っている場合は、私に電子メールを撃つこと自由に感じなさい。
投稿者 cash advance payday loan : 2012年1月13日 03:11
ハウディ！私は私の新しいiphoneからあなたのブログを閲覧中の仕事でね！ちょうど私があなたのブログを通して読んで愛と言うとすべての投稿を楽しみにしたい！素晴らしい仕事を運ぶ！
投稿者 search engine optimization vancouver : 2012年1月13日 16:59
一緒にこの特定のエリア全体に構築しているように見えるほとんど全てと、ビューのすべての点ではやや刺激的に起こる。私はすべてそれがエキサイティングどれ少ないことない、あなたの全体的なアイデアを購読することができないため、私は、あなたの許しを請うているということ。それはあなたの発言は一般的に完全に合理化されておらず、現実にあなたも、一般的にあなたのポイントの完全に自信を持ってあなたの自己ではないことを皆に表示されます。いずれの場合でも、私は楽しむことを見ていた。
投稿者 oh canada : 2012年1月21日 12:19
コメントしてください
』
』