<分区>
<分区>
HTML
<div class="row">
<div class="box">
<div class="one">
one
</div>
</div>
<div class="box">
<div class="two">
two
</div>
</div>
</div>
CSS
.box {
float: left;
width:calc(50% - 1px);
background: green;
margin-right:1px
}
.one {
height: 50px;
}
.two {
height: 100px;
}
我有几行，每行有 2 个框，每个框根据内容具有不同的高度。我希望根据内容为每个框设置相同的高度。
在上面的示例中，我希望内容为“一”的框具有高度 应与内容为“二”的框具有相同的高度
最佳答案
你可以使用flexbox(没有box div):
.row {
display: -webkit-box;
/* OLD - iOS 6-, Safari 3.1-6, BB7 */
display: -ms-flexbox;
/* TWEENER - IE 10 */
display: -webkit-flex;
/* NEW - Safari 6.1+. iOS 7.1+, BB10 */
display: flex;
/* NEW, Spec - Firefox, Chrome, Opera */
}
.one,
.two {
float: left;
width: calc(50% - 1px);
background: green;
margin-right: 1px;
}
关于html - 如何根据父项为框应用高度 100%，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38255012/