CSS 包装器 div 高度：100% 未覆盖整页高度

Question

当 div id="content" 中没有足够的内容时，红色包装填充 100%，但当内容变长时，红色包装未填充 100% 屏幕高度，内容 div 溢出。

代码：http : //codepen.io/anon/pen/JAbuq

这是要演示的图像，将浏览器重新调整为较小的高度。我需要这个用于移动浏览器显示。

Answer 1

使用min-height: 100%而不是height: 100%允许包装器超出浏览器视口高度：

#content-wrapper {
  width: 100%;
  float: none;
  position: absolute;
  box-shadow: none;
  overflow: visible;
  min-height: 100%;
  background: red;
}

演示：http : //codepen.io/anon/pen/niCfJ/