flex 布局华为meta8 自带浏览器兼容

现在的手机有很多的需要垂直居中和水平居中，还要和能够很完美的配合适屏的需求，css3中出现了完美的盒模型box-flex和flex弹性布局，

网上能找到各种关于这两种布局的资料，用法也不难；

哈哈昨天上线突然发现华为note8 浏览器不兼容flex 布局，只需要一招变解决了问题，最好还是记录一下。

兼容问题

现在大多数的手机都是能够兼容flex布局的，而且我们主要用的也是flex更多一些，所以对于box布局并没有太多的使用与研究，但是最近在使用flex布局的时候却发现华为meta8自带的浏览器（版本比较低的啦）却对这个flex布局不支持，却对下面的这个属性支持，这样又可以使用啦啦啦啦。。。。。

.box{
    display: -webkit-box;
}

哈哈，更让人跌破眼镜的是，在兼容华为meta8自带浏览器的时候，因项目中使用的是stylus预处理器，在进行编译的时候却不能编译

.item{
    -webkit-box-flex:1;
}

最后的最后加了一个padding的属性才可以编译，虽然不知道为啥，但是编译成功了,而且值得注意的是：这个padding的属性必须放紧挨着才可以编译，虽然觉得有点不可思议。。。。。

.item{
    -webkit-box-flex:1;
    padding 0
}

上线成功！！！！！！！！