今天开发遇到一个问题就是: flex布局之后，左右子元素高度不一样的情况下，父元素由比较高的子元素撑起高度，而另一个高度小的子元素则会被自动撑起一样的高度。
解决方法就是：给父元素添加 align-items: flex-start
<div class="contain ">
<div class="left">left</div>
<div class="right">right</div>
</div>
.contain {
display:flex;
align-items: flex-start;
}
.left {
width: 100%;
height: 300px
}
.right {
width: 100%;
height: 100px
}