思路:
1、child2 设置超大 padding-bottom、负 margin-bottom,得到 padding 撑开的背景色
2、同时使用 vertial-align: top 保证两个子元素上对齐
1、child2 设置超大 padding-bottom、负 margin-bottom,得到 padding 撑开的背景色
2、同时使用 vertial-align: top 保证两个子元素上对齐
3、父元素设置 overflow: hidden; 把多余的背景色截取掉
<div class="parent">
<div class="child1"></div>
<div class="child2"></div>
</div>
.parent {
overflow: hidden;
}
.child1 {
vertical-align: top;
display: inline-block;
width: 50px;
height: 100px;
background: red;
}
.child2 {
vertical-align: top;
display: inline-block;
padding-bottom: 9999px;
margin-bottom: -9999px;
width: 50px;
background: green;
}