vue微信公众号开发flex踩坑

        "display:flex"对于布局页面来说是一把利器，但是当它被应用于移动端布局时，常常会冒出一些幺蛾子。

        微信端录入和显示客户信息常常会出现以下布局，这种布局用纵向flex嵌套横向flex，再用flex:1使得元素自动撑满剩余空间，是一件轻而易举的事情。

        还有这种头部提示信息和正文部分的布局等，都可以用flex简单的完成。

        

         但是在ios手机上，我就遇到过这两种问题：

1、当 flex:1 遇上 input，input撑开会失效。

        解决办法：可以加“ width: 0%; ”修饰。

        （这种情况在华为p30和一些内核较低的手机上也出现过）

2、padding失效内容会被挤压。

        解决办法：我试过很多种，但是最好的还是改变更布局，去除flex嵌套的模式。

所以建议大家，涉及到移动端的页面，还是少用flex嵌套flex的样式设计吧。