你能告诉我如何使第二个div
的内容对齐到底部吗?不设置高度
的情况下,这两个盒子的大小是一样的?
null
div {
background: blue;
display: inline-flex;
width: 100px;
height: auto;
}
<div>
1<br>
2
</div>
<div>
1
</div>
null
为此,您需要一个带有display:flex
的父容器来扩展它们的子容器,并将align-items:flex-end;
添加到子容器div
null
.container {
display: flex;
}
.container div {
background: blue;
display: inline-flex;
align-items: flex-end;
width: 100px;
height: auto;
}
<div class="container">
<div>
1<br> 2
</div>
<div>
1
</div>
</div>