这是一个已报告的Webkit（chrome /safari）错误，具有最小身高的父母的孩子不能继承height属性：
:

显然Firefox也受到了影响（目前无法在IE中进行测试）

可能的解决方法：

• 添加位置：相对于#containment
• 将位置：绝对添加到＃containment-shadow-left

当内部元素具有绝对定位时，该错误不会显示。

编辑于2014年4月10日

由于我目前正在从事的项目中 确实 需要带有的父容器min-height，而子元素继承了容器的高度，因此我进行了更多研究。

第一： 我现在不确定当前浏览器的行为是否确实是一个错误。CSS2.1规范说：

相对于生成的盒子的包含块的高度计算百分比。如果未明确指定包含块的高度（即，它取决于内容的高度），并且该元素的位置不是绝对的，则该值将计算为“自动”。

如果我将最小高度放在容器上，则不会 明确 指定其高度-因此我的元素应该具有auto高度。而这正是Webkit和其他所有浏览器的作用。

其次，我找到了解决方法：

如果将我的容器元素设置为display:table，height:inherit则其行为与我将其设置min-height为100％时完全相同。而且-更重要的是-如果我将child元素设置为display:table-cell它，它将完美继承容器元素的高度-无论它是100％还是更高。

完整的CSS：

html, body {
  height: 100%;
  margin: 0;
}

#container {
  background: green;
  display: table;
  height: inherit;
  width: 100%;
}

#content {
  background: red;
  display: table-cell;
}

标记：

<div id="container">
  <div id="content">
      <p>content</p>
  </div>
</div>