CSS 嵌套容器上的高度相同
示例
此代码确保所有嵌套容器的高度始终相同。这是通过确保所有嵌套元素的高度与包含其的parrentdiv相同的高度来完成的。
由于该属性默认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; // 默认值 }
注意:不适用于10以下的IE版本