本文通过对方框中方框图的分析，为CSS学习中的CSS学习提供了一个清晰的模型。

W3C定义的Box模式如下：


宽度和高度定义内容部分的宽度和高度，并且填充边框边距的宽度依次添加。背景填充填充和内容部分。
但由于浏览器设计的问题，不同浏览器的效果会有所不同。
左右边界加倍问题
当箱浮的盒子在IE6的保证金将双
的内左侧明显大于对边缘的左侧5px。
此时，内部的显示属性被定义为内联。
外箱自动高度计算问题
根据W3C定义，没有浮点数属性的外箱不会自动计算高度。要计算高度，必须将内层的最后一个框添加到清除中：两个。
歌剧，Netscape，Mozilla等将不计算外层框的高度，但微软的IE6将自动计算外层高度。

上面的代码在IE中有黑色背景，但是没有正确的计算。添加一个明确的经过：属性的div Inner2，我们可以正确计算利润。但仍然有一个黑色的背景，通常的解决办法是定义明确：无论是div，或插入他们的空间，所以有必要增加额外的高度。在互联网上一个更好的解决办法是将溢出属性为最外层的div和使用明确的：所以它不会增加额外的高度。

因此，外部CSS定义了溢出属性，内层最后添加到清除属性中。
中的问题
如果您的布局包含在一个层（容器）中，您需要定义元素的宽度并定义横向边距：
您可以以这种方式水平地定义它：
{ #包
宽度：760px； / *修改你的层的宽度。
保证金：0汽车；
}
但IE5 /赢不能正确显示这个定义，我们使用一个非常有用的技术来解决这个问题：使用文本对齐在外层的属性，像这样：
{ #外
文本对齐：中心；
}
{ #包
宽度：760px； / *修改你的层的宽度。
保证金：0汽车；
文本对齐：左对齐；
}
第一个是文本对齐：对#外中心；规则定义#外在IE5 /赢得所有元素集中（其他浏览器只是中心的文本），第二文本对齐：左是#经左字。
因此，在具有中间元素的CSS中，外部CSS必须定义文本对齐：中心属性，内层由空白定义：X自动X自动，文本对齐被重新定义。