ボックスモデル：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ボックスモデルには、私には見られないいくつかの利点がありますか？または、ここで問題を単に誇張していますか？

幅にパディングとボーダーを含めるかどうかの選択は任意でした。重要なのは、複数列のレイアウトを構築することだけでした。ただし、とにかく当時は人々がレイアウトにテーブルを使用していたという事実を考慮する必要があります。したがって、彼らにとって懸念は十分に重要ではないと思われ、コンテンツ自体がCSSで占める正確な幅を指定できることは、はるかに価値があると考えました。

今日の開発者にとっては、レイアウトにCSSを使用し、CSSボクシングモデルを処理する必要があるため、状況はまったく異なっているように見えます。ありがたいことに、ボクシングルールをオーバーライドできるようになったため、ほとんどの場合、スタイルシートの上部にある単純なルールは途方もなく機能します。

* {
    -mox-box-sizing: border-box;
    box-sizing: border-box;
}

主題についてジェフ・カウフマンを引用するには：

しかし、仕様がそれを別の方法で定義していることを考えると、彼らの誤解を採用するためにマイクロソフトに送ったであろうシグナルは、ウェブにとって悪いものだったでしょう。マイクロソフトはすでに、抱擁、拡張、および消滅のアプローチを使用しており、ユーザーをマイクロソフトのバージョンにロックするために、競合他社とは異なる動作をする製品を意図的に作成していました。彼らはWebの成功に非常に近づきました：およそ2000年から2005年にかけてIEは非常に人気があり、多くのサイトがそのためだけに設計されました。ここでIEのアプローチを採用すると、Microsoftに「IEで何でもできるので、標準を調整して合法化する」と語ったかもしれません。

そのため、ボックスモデルはW3CとMicrosoftの間の権力闘争の犠牲になりました。