例如，我有以下html：
<html><head>
<link href="css/bootstrap.css" rel="stylesheet">
<style type="text/css">
.col-1{
height: 300px;
}
.col-2{
/*
height: 100% not working, how to stretch col-2 like col-1
*/
}
</style>
</head>
<body>
<div class="container">
<div class="col-md-6 col-1">
</div>
<div class="col-md-6 col-2">
</div>
</div>
</body></html>
容器的高度是自动的，但实际的高度是定义的，因为col-1的高度是300px。如何将col-2高度设置为实际父母身高的100％？
也许您应该尝试使用“ row row-eq-height”类。
尝试使用<div class="row row-eq-height"></div>代替<div class="row"></div>
并将此CSS属性添加到您的自定义CSS
.row-eq-height{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句