手机端横向滚动条修复与 postion:sticky 冲突问题

[rizon]

自适应网页，手机端会导致横向滚动条出现，可以横向移动，这是由于垂直滚动条占用了屏幕位置导致，修复方案

:root {
    overflow-x: hidden;
}
:root body {
    position: absolute;
}
body {
    width: 100vw;
    overflow: hidden;
}

这个方案可以解决这个问题，但是引发另一个问题：

网页中使用了 position:sticky ，这个要求父元素不能是 position: absolute;

这下怎么办啊

[alvinbone88]

你 body 设置成 overflow: hidden ，页面还能滚动吗

[rizon]

@alvinbone88 #1 会导致 position sticky 失效的

[rizon]

该问题已解决，是由于页面的一些地方 margin 负数超出了屏幕才出现的横向滚动问题。修复一下就好了。

并不是所谓的垂直滚动条占用屏幕空间（国内某博文看到的，完全在瞎扯误导了我）