1. height: 100%

众所周知，父元素没设定具体高度时，子元素 height:100% 无效。

原因：规范里说明了，如果包含块的高度没有显示指定（即高度由内容决定），且该元素不是绝对定位，则计算值为 auto。
auto * 100% = NaN.

但是宽度的解释是：如果包含块的宽度取决于该元素的宽度，那么产生的布局在 css2.1 中是未定义的。

高度明确了是 auto，百分比计算自然无果，width 却没有这样的说法，因此，就按照包含块真实的计算值作为百分比计算的基数。

如何让元素支持 height:100%？

1. 设定显式的高度值，如：height: 100px，或设置可以生效的百分比值高度，如：

   html, body {
     height: 100%;
   }
   

   case
2. 使用绝对定位

   div {
     height: 100%;
     position: absolute;
   }
   

   绝对定位的宽高百分比计算是相对于 padding box，也就是说会把 padding 大小值计算在内。非绝对定位是相对于 content box.
   case