我正在使用flexbox做一个简单的标题/正文/页脚布局.但是,当我的"body"有很多内容(足以强制滚动条)时,我在Chrome中看到了一个问题:它会强制页眉和页脚元素在它们不应该缩小时缩小.这只发生在Chrome中(IE11和Firefox按预期工作).我应该以不同的方式使用我的CSS,还是这是Chrome的问题？
我已经简化了我的HTML/CSS以显示问题,并创建了我在不同浏览器中看到的截图(http://i.stack.imgur.com/Qn5Ln.png):
body { height:100%; position:absolute; left:0; top:0; right:0; bottom:0; background:red; display:flex; flex-direction:column; }
div { padding:10px; background:green; }
div#stretch { overflow:auto; flex:0 1 auto; min-height:200px; background:blue; }
#space { height:80000px; display:block; }<div>Header</div>
<div id="stretch">
<span id="space"></span>
</div>
<div>Footer</div>