1
ボックスモデル：Internet ExplorerとW3C
現在、Internet Explorerボックスモデルの問題はほとんど問題ではありません。ほとんどのWeb開発者は、<!DOCTYPE>標準への準拠を強制するためのタグを配置しますが、Internet Explorer 5.5のサポートを本当に気にする人はいません。 しかし、一部の開発者は、IEボックスモデルを防御するための主観的で概念的な議論を思いつきました。IEモデルはボックス自体を測定するのに対し、W3Cモデルはボックスのコンテンツを測定するため、IEボックスモデルはW3Cモデルよりも「直感的」であると主張しています。 私は彼らの視点を見ることができますが、それは基本的に主観的な議論であり、最も重要なことは標準への準拠です。 ただし、最近、深刻な実用上の理由からIEボックスモデルを好むようになりました。W3Cボックスモデルでは、要素を別の要素の正確な画面上のピクセル幅に動的にサイズ変更することは困難です。その理由はstyle.width、要素のプロパティが要素の画面上の合計サイズを考慮していないためです。追加の境界線とパディングも考慮する必要があります。両方の要素が同じCSSクラスを使用している場合、これは問題ではありませんが、異なる CSSクラスがある場合、これは非常に困難になる可能性があります。 AとBの2つのdivがあるとします。AはHTMLで400px divとしてハードコードされていますが、BはJavascriptを使用して動的に作成されます。視覚的には、BをAの正確な幅にする必要があります。古いIEボックスモデルでは、これは簡単です。私たちは単に言う：B.style.width = A.style.width、またはB.style.width = A.offsetWidth + "px"。 しかし、W3Cボックスモデルでは、これはそれほど単純ではありません。また、スタイルシートについても心配する必要があります。BがAと同じCSSクラスを持っている場合、単に言うことができますB.style.width = A.style.width。しかし、そうでない場合、そして美的理由でそれを望まないかもしれない場合、私たちは困っています。ここで、AとBの両方の境界線とパディングの合計ピクセルを考慮する必要があります。境界線とパディングが一貫性のない単位で指定されている場合、これは特に困難です（境界線は1px行であることが多いため、 emsで指定される場合があります）。次に、共通の単位（emからpxまたはpxからem）に変換する準不可能なタスクに直面しています。これはすべて、2つのdivを画面上に正確に並べるためです。 したがって、基本的に、W3Cボックスモデルでは、要素のサイズを設定するときにCSSの境界線とパディングの問題を考慮する必要がありますが、IEボックスモデルでは、幅がボックス全体のサイズを測定するため（エンドツー-end）、ボックスの内容ではなく。これにより、相互に関連して要素を動的にサイズ設定することが非常に簡単になります。 これはすべて、W3CモデルよりもIEボックスモデルを優先する非常に強力な理由のようです（少なくとも概念的には-もちろん、実際にはIEボックスモデルは死んでいます）。 質問：W3Cはなぜこのボックスモデルを選択したのですか？W3Cボックスモデルには、私には見られないいくつかの利点がありますか？または、ここで問題を単に誇張していますか？