css - 最小高度为 : 100% not inheriting height 的父项内的子项

Question

我找到了一种方法，通过设置 min-height: 100%; 使 div 容器至少占据页面的整个高度。但是，当我添加一个嵌套的 div 并设置 height: 100%; 时，它不会拉伸(stretch)到容器的高度。有办法解决吗？

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

#containment {
  min-height: 100%;
  background: pink;
}

#containment-shadow-left {
  height: 100%;
  background: aqua;
}

<div id="containment">
  <div id="containment-shadow-left">
    Hello World!
  </div>
</div>

Answer 1

添加 height: 1px 到父容器。适用于 Chrome、FF、Safari。