Flexbox - 使弹性子项高度为100%

Question

4

包含我正在使用的相同HTML/CSS的JSFiddle： http://jsfiddle.net/pf5bczLe/

如何使.box的高度为其父元素，即.box-wrap的100％？

根据this帖子，它是flexbox项目的缺陷，不会作为其子项的100％高度。是否有其他方法可以实现所有项目具有相同的高度，尽管它们的高度是动态的？

感谢您的时间

- MelkorNemesis

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- scniro · Accepted Answer

非常接近于拉伸子元素。在您的示例中进行操作，将以下css添加到.box-wrap

.box-wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
}

然后将以下内容添加到.box中。

.box {
    -webkit-flex: 1;
    flex: 1;
 }

JSFiddle Link