巢狀容器上的高度相同
此程式碼確保所有巢狀容器始終具有相同的高度。這是通過確保所有巢狀元素與包含 parrent div 的高度相同來完成的。參見工作示例 ： https ： //jsfiddle.net/3wwh7ewp/
由於屬性 align-items 預設設定為 stretch，因此實現了此效果。
HTML
<div class="container">
<div style="background-color: red">
Some <br />
data <br />
to make<br />
a height <br />
</div>
<div style="background-color: blue">
Fewer <br />
lines <br />
</div>
</div>
CSS
.container {
display: flex;
align-items: stretch; // Default value
}