水平属性的总和总是等于父元素的宽度？这是真的？

Question

我正在阅读Eric Meyer的 CSS：The Definitive Guide ，在他关于块级盒子模型基础知识的章节中，他做了以下声明：

  

请记住，七个水平属性的总和始终等于父元素的宽度。只要所有属性都为零或更大，元素就永远不会比其父元素的内容区域宽。

通过水平属性，他的意思是：

这让我感到虚伪。例如，这样的情况怎么样：

<div>
  <p>content</p>
</div>

div {
  width: 100px;
}

p {
  width: 300px;
}

包含块的宽度为100，段落为300，这意味着折扣所有其他水平值，子段落将明显大于其包含块的宽度（导致溢出）。我错过了什么？

Answer 1

您引用的语句似乎反映了section 10.3 of the spec中的以下等式：

  

以下约束必须包含在其他属性的已使用值中：

     

    

＆＃39;利润率左＆＃39; +＆＃39; border-left-width＆＃39; +＆＃39; padding-left＆＃39; +＆＃39;宽度＆＃39; +＆＃39; padding-right＆＃39; +＆＃39; border-right-width＆＃39; +＆＃39; margin-right＆＃39; =包含块的宽度

  

然而，规范确实如下：

  

如果＆＃39;宽度＆＃39;不是＆＃39; auto＆＃39;和＆＃39; border-left-width＆＃39; +＆＃39; padding-left＆＃39; +＆＃39;宽度＆＃39; +＆＃39; padding-right＆＃39; +＆＃39; border-right-width＆＃39; （加上任何＆＃39; margin-left＆＃39;或＆＃39; margin-right＆＃39;不是＆＃39; auto＆＃39;）大于包含块的宽度，然后是任何＆ ＃39;自动＆＃39; ＆＃39; margin-left＆＃39;的值或者＆＃39; margin-right＆＃39;对于以下规则，被视为零。

这意味着如果width属性的指定值不是auto，则块框的宽度可能可能违反此约束而不会产生反响。特别是，它没有说为了满足约束而需要调整框的大小（除了将自动边距视为零，这与您的情况无关）。只有在width属性为auto时才需要进行调整，在这种情况下，无论如何都会动态调整框的大小。

出于某种原因，第10节没有直接指定当计算出的块框宽度超过其包含块的宽度时溢出应该如何发生，使得上述约束不能满足。但是，引入section 11.1的the overflow property非常明确地指出溢出应该在与您演示的情况完全相同的情况下发生：

  

通常，块框的内容仅限于框的内容边缘。在某些情况下，盒子可能会溢出，这意味着它的内容部分或全部位于盒子之外，例如：

     

  
• ...
  
• 块级框对于包含块来说太宽。这可能发生在元素的宽度为“0”的情况下。 property具有一个值，该值会导致生成的块框溢出包含块的边。
  

还要注意使用＆＃34;一般＆＃34;这里。

如果本书的相关章节未考虑此例外情况，则可能是疏忽。我无法肯定地说，因为我自己还没有读过这本书。

Answer 2

Total of the seven horizontal properties always equals the width of the parent element. - 除非或直到你决定强行反对，

示例：

• 将子元素的宽度定义为大于父元素的宽度。
• 使用负边距。

任何其他人都知道其他情况请加入。