Html 为什么赢了'；t盒尺寸：边框盒；在960.gs中应用于容器时是否工作？

我正在使用框大小：边框框来显示页面上的所有内容。但是，当我在960.gs网格中向容器元素添加填充时，它会将第二个网格碰撞到下一行。但是，如果我将它添加到各个网格类中，它确实会像预期的那样工作

<header role="banner" id="header">
     <div class="container container_12">
          <div class="grid_4">
               logo here
          </div>
          <div class="grid_8">
               tagline here
          </div>
     </div> </header>

这里的标志
这里的标语

---

将10px的填充添加到。conatiner将网格_8包装到下一行。将10px同时添加到网格4和网格8中并不起作用（框大小调整工作）。非常感谢您的帮助。

我相信它工作正常

框大小：边框框

覆盖默认行为，即向（非绝对大小）元素添加填充和边框会增加该元素的总大小。使用

边框框

，所有元素的行为就好像它们的大小都与填充有关：添加填充会增加元素边框与其内容之间的内部空间，但不会增加元素的总大小

因此，通过将

padding:10px

添加到

.container

，可以减少

.container

内容的水平内部空间量。由于

.container

的宽度不会增加（由

框大小调整规则指定），并且子元素不会收缩，因此第二个子元素必须包裹，因为两个子元素的组合宽度现在大于
.container
的可用内部空间

将填充添加到
.grid
元素“有效”（您对“有效”的定义假定为
.container
的子元素可以放在一行中，并且不会换行），因为根据
框大小调整
规则，这些元素在给定填充时不应增加其设置宽度之外的宽度（设置为960 gs）。添加填充的结果是增加
.grid
元素的边框与其内容之间的空间（“此处的徽标”/“此处的标语”），并减小
.grid
元素的“内部宽度”

基本上，
box size:border box
意味着填充（和边框！）是在内部添加的，而不是在外部添加的，您的示例一致地演示了这种行为

是的，基本上是这样。我应该注意到，
边框框
，顾名思义，用于根据元素的边框调整元素大小，而不仅仅是填充；这将是
填充框
（我不确定是否已转储的Mozilla扩展）。虽然在本例中，差异并不重要，因为960.gs不使用边框，而且填充在这两种框大小调整中都有考虑。在原始的W3C box模型
内容框中，它不是？我已经用“padding and borders”替换了几个“padding”的例子，以使其更为正确。感谢您深思熟虑的回复。这帮了我很大的忙（这很有道理）。