2 列のレイアウト (メイン コンテンツとサイドバー) が使用されている場合、メイン コンテンツの DIV は Float:left で、Sidebar は Float:right です。私はそれの 1 つの利点を参照してください。box-sizing の場合: content-box; (デフォルト) が使用されると、必要以上のスペースが一緒に収まるように残され、両方が反対側に浮くので、問題が発生しても両方が画面に収まります! ラッパーがサイドバーとコンテンツの合計幅 (それらが収まるように残されている) よりも大きい場合、サイドバーとコンテンツの間のスペースが必要以上に大きい場合があります。これはブラウザにも依存します。
ただし、「box-sizing: border-box;」では 両方の Div の間に余分なスペースを残さなくても、両方が期待どおりにぴったり合っていることがわかります。
どちらが優れているのか、その理由は?
<div id="content">
With CSS: Float:left;
</div>
<div id="sidebar">
With CSS: Float:right;
</div>
または、
<div id="content">
With CSS: Float:left;
</div>
<div id="sidebar">
With CSS: Float:left;
</div>
レスポンシブデザインも考えてください。