google-chrome - 如何使列 flex 具有高度：100%？

Question

我想让以下内容垂直填充视口：

http://codepen.io/anon/pen/lkpKu

但是，应用height: 100%到外部 div 只要它有display: flex.

这是从：

http://codepen.io/chriscoyier/pen/qazmI

水平填充视口没有问题。

有什么办法可以做到这一点？我愿意看到黑客，但理想情况下，这不需要我使用 Javascript 手动实现相同的效果（我知道该怎么做，我不问）。

我只是想让它在最新的 Chrome 上运行。

Answer 1

只需将 100% 的高度添加到 html 和 body 标签。html, body{ height:100%;}