微信小程序在安卓不会左右滑动，在ios苹果会的解决方法

哈喽开发者，这是平时遇到问题的总结，如果对你有帮助，点个赞~

问题

小程序做完后在安卓机上不会左右滑动，在苹果机出现左右滑动的问题，以下提供了多种方法，可以逐个试试。

问题分析

据我了解，此问题有两种原因
一是你某些模块的宽度超过了手机的宽度，溢出了，你们就会想到overflow裁剪了吧
二是你设display：flex等盒模型的时候，设置了padding和margin等边距，它是默认会将边距添加到总宽度的，所以也就导致你的元素变宽了，这个问题安卓机没事，苹果就不兼容了。这里就需要一个属性 box-sizing:border-box；

问题方式

方法一 像最外面的框框，也就是page设裁剪

page{
width:100%;
overflow:hidden;
}

---

方法二 对症下药，对每个大模块加hidden

---

方法三 在每个大元素上添加box-sizing:border-box；这个属性是让外边距内边距不会添加总宽度的宽度,而是把元素内的元素缩小了一点，然后把内边距外边距加入进去

display:flex
or
display:block
box-sizing:border-box；

---

方法四 定位，设置后左右上下都无法滑动，终极方法，原理是脱离文档流，绝对定位在整个手机端，所以左右上下都无效

page{
  width: 100%;
  height: 100%;
  position: fixed;
}

记得评论点赞哦