css - 将页面一分为二（垂直）在两个孩子之间，如果一个不可用，另一个应该覆盖整个页面

Question

我希望这些图片能描述我想要的。目前两个子 div 都有height:50% 但是，当其中一个不存在时，我希望另一个覆盖整个页面。

我正在寻找css唯一的解决方案，因为我认为我错过了一些非常基本的东西！:P

Answer 1

不使用 flex 模型或 JavaScript，祝你好运 :)

如果您只对现代浏览器没问题，那么请使用 flex 布局。制作一个容器，flex-direction: column并为每个 div 内的 flex 值赋予flex: 1 1 auto;.

看到这个小提琴。