CSS 对待高度和宽度的方式不同？

Question

关于 this podcast据说 CSS 宽度会传递给 child ，但高度会传递给 parent 。相关部分从 11:43 开始，持续几分钟。

虽然不幸的是，我很容易相信 CSS 会做那样奇怪的事情，但我希望看到一个示例页面来演示这一点。

谁能做出一个页面，清楚地显示高度是向上传递而不是向下传递的？

Answer 1

从上到下(外部到内部)。外部高度不影响内部。

div {
  border: 1px solid;
}

.outside {
  height: 200px;
}

<div class="outside">
  <div class="inside">Inside</div>
</div>

从下到上(内部到外部)。内部高度确实会影响外部。

div {
  border: 1px solid;
}

.inside {
  height: 200px;
}

<div class="outside">
  <div class="inside">
    Inside
  </div>
</div>