html5：具有固定顶部/底部和可滚动中间的三行弹性框
问题描述：
可以使用固定页眉/页脚和可滚动的 html5 c> article 部分，例如 firefox 24和 chrome 31？
Is it possible to make an html5 flexbox layout with fixed header/footer and a scrollable article section like the following for firefox 24 and chromium 31?
+----------+
| header |
+----------+
| article ||
| ||
| ||
| ||
+----------+
| footer |
+----------+
（简化）：
body {
display: flex;
flex-direction: column;
}
header {
flex: 1;
}
article {
flex: 8;
overflow-y: scroll;
}
footer {
flex: 1;
}
现在我试图用 article ，但如果内容高度小于窗口高度，则页脚不固定，如果它更大，页脚将滚出可见区域...
and now I'm trying to fill the remain space with the article, but if the contents height is smaller than the window height, the footer is not fixed and if it's bigger, the footer scrolls out of the viewable area...
答
您可能需要确保身体的高度为100％：
You probably need to make sure the body is 100% high:
html, body {
margin:0;
height:100%;
min-height:100%;
}
我做了小提琴。