背景：
在做移动端项目时，遇到了一个问题，css设置商品的高度是自动的，但是左边的商品的高度，莫名就变高了，有很大的一块空白，如下图。
但当左右两数据相同时，高度显示又是正常的。
原因：
最后，找到问题所在，原来是flex布局，会让其子项的高度一致 。所以，才会出现上面的情况。
Flex 布局会默认：
把所有子项变成水平排列。
默认不自动换行。
让子项与其内容等宽，并把所有子项的高度变为最高子项的高度。
问题：
Flex布局如何让子项保持自身高度
解决方案：
直接在 flex 容器上，将 align-items 设为 flex-start ,或者 align-items 属性的其他值都可以, 子项就会保持其自身的高度了 。
