我正在使用CSS Flexbox进行页眉/正文/页脚布局。但是，如果使用overflow-x：hidden增添了外部div，Chrome会在减小视口高度时开始裁剪底部（状态元素），并引入垂直滚动条。
Firefox通过缩小元素高度来按预期工作，并在减小浏览器高度时继续显示状态栏。 如果重新加载页面或更改视口宽度，Chrome会恢复正确的布局。
Stackblitz示例： https://stackblitz.com/edit/angular-xtapbp
Chrome和Firefox之间的区别可以通过在两个浏览器中显示上述堆栈闪电来看出。
答案 0 :(得分：1)
对于弹性版式，min-height（或min-width的默认值flex-direction: row）的隐含值为auto。由于某些原因，Chrome决定将在初始页面呈现期间所拥有的内容大小视为当前的auto值，并且在缩小窗口期间不会重新计算整个布局。可能是Chrome CSS布局引擎中的错误。一种解决方案是将min-height: 0添加到content + status div中，如this link所示。