CSS3灵活的盒子布局(最新)最大高度

时间:2012-11-14 17:55:24

标签: css google-chrome css3 webkit flexbox

我正在使用latest灵活的盒子规格(据我所知,目前仅由最新的Chrome支持)并且我试图阻止弹性物品超过最大高度。

最好用一个示例解释:http://jsbin.com/efedof/2/edit

第一个示例.content(加上两个.bar元素)不超过300px的高度,所以是正确的。但是在第二个示例中,文本在.content div之外向下推动.box的底部。

如何强制执行三个组合弹性项目的最大总高度,以便.content区域变为可滚动而不是在.box之外拉伸并将.bar推出.box

感谢。

1 个答案:

答案 0 :(得分:5)

Found the answer!。诀窍是将min-height: 0;添加到.content div。