Bab*_*aas 10 html css height flexbox
我有以下 html 和 css：
HTML：
<body style="height:100%;">
<div class="fb-container">
<div class"somedatadiv">
Some data
</div>
<div class="anotherdiv">
data
</div>
</div>
</body>
CSS：
.fb-container {
display: flex;
flex-wrap: no-wrap;
align-items: stretch;
// min-height: 100%;
}
.somedatadiv {
width: 75%;
max-width: 345px;
backround: grey;
padding: 30px;
}
出于某种原因，flex 容器 div 没有拉伸 100% 的身体高度。
（对于这个“演示/应用程序/站点”，我使用的浏览器是 chrome）
您需要添加display:flex到父标签，然后添加到子标签，flex:1以使子标签能够扩展到父标签的100%。
.fb-container {
background-color:green;
flex: 1;
}
.somedatadiv {
width: 75%;
max-width: 345px;
background-color: grey;
padding: 30px;
}<body style="height:100vh;display:flex;">
<div class="fb-container">
<div class="somedatadiv">
Some data
</div>
<div class="anotherdiv">
data
</div>
</div>
</body>