微信小程序 —— 多个view左右对齐的巧用方法（display:flex布局）

在以前写web端代码的时候，遇到俩个，三个的div平铺在一个大div中我都会用“width: 50%;display:inline-block;”这种方法来搞定，但是这样的写法很low,而且会经常有一种情况出现：

左边右边总有一个不能很好的对称

但是现在有简单一个方法，可以解决这个问题：

在最外层的view(div)中加“ display: flex; ”

.free-all{
display: flex;
}
.free-all>view{
width:50%;
display: inline-block;
}

display:flex 多栏多列布局浏览器支持情况：火狐直接支持w3c无前缀写法，谷歌和opera支持-webkit- 前缀写法，比较适合移动端开发使用。

flex-flow: row; row横向（左向右）显示

flex-flow: column; column竖向（上向下）

例子 ：即使"width:50%;display:inline-block;"在外层view加上"flex-flow: column;"依旧是竖向显示;

.free-all{
display: flex;
flex-flow: column;
}