flex布局（弹性布局）几注意事项

1. 注意事项
   当父容器设置了

display： flex  

子类将会默认按照 一列一列的排列，如下图
即他默认css

flex-direction: row

即使你父容器没有设置这条属性

如果不想子类这样排列，而是一行一行的排列，将父容器的css改为

display: flex;
flex-direction: column;

总结flex-direction几大样式值

flex-direction: row // 子元素在一行中排列
flex-direction: row-reverse  // 子元素以逆顺序在一行中排雷
flex-direction: column   // 子元素在一列中排序
flex-direction: column-reverse   // 子元素以逆顺序在一列中排序

2.注意事项
webkit内核的浏览器，必须加上-webkit前缀

display: -webkit-flex;
display: flex;

顺便给我自己科普下几大浏览器的内核
Webkit : Safari, Google Chrome, 傲游3，猎豹浏览器， Opera浏览器