相关疑难解决方法(0)

我想使用flexbox使用全高应用程序.我在这个链接中使用旧的flexbox(显示:框;以及其他东西)找到​​了我想要的东西:CSS3 Flexbox全高应用和溢出

对于旧版本的flexbox css属性,这是一个正确的解决方案.

如果我想尝试使用较新的flexbox属性,我将尝试在同一链接中使用第二个解决方案,但使用高度为0px的容器 "黑客"弹性框; 它使显示垂直滚动.

我不喜欢它,因为它引入了其他问题,它更像是一个解决方案而不是解决方案.

我准备了一个基本示例的jsfiddle:http://jsfiddle.net/ch7n6/

html, body {
    height: 100%;    
}
#container {
	display: flex;
	flex-direction: column;
	height: 100%;
}
#container article {
	flex: 1 1 auto;
	overflow-y: scroll;
}
#container header {
    background-color: gray;
}
#container footer {
    background-color: gray;
}

它是一个"全高html网页",由于内容元素的flexbox,页脚位于底部.我建议你在css代码和结果之间移动吧来模拟不同的高度.