我检查了其他主题，但我似乎无法弄清楚这一点。在这里测试这个网站：http://www.mf.jlscs.com/
在 Mobile Safari 的纵向视图中，我可以向右滚动到空白的白色填充。我不想要这个。
在横向视图中，不存在这种滚动，它会按照我的意愿呈现。
我不知道是什么导致了这种神秘的推动。我试图消除溢出-x，但这并不能解决问题。如果我在每个容器上消除溢出-x，那么页面中的每个容器都会发生同样的效果。有什么想法吗？
【问题讨论】：
仅仅为某些 div 添加边框可能会导致布局发生变化。 将此添加到 CSS 的底部以查找流氓元素：
* {
background: #000 !important;
color: #0f0 !important;
outline: solid #f00 1px !important;
}
我还制作了一个通过 javascript 执行此操作的书签，因此可以轻松地在任何网站上使用。 http://blog.wernull.com/2013/04/debug-ghost-css-elements-causing-unwanted-scrolling/
【讨论】：
这很可能是由于您的结构元素中的任何一个超出了您的身体宽度。寻找类似于width: 100%; padding 20px; 的代码或使其成功的代码。
我建议在所有主要 div 上放置一个红色边框，看看哪个是罪魁祸首并延伸到边缘。
【讨论】：
确实，这个问题是由于某些原因超出了文档宽度的“流氓”元素。
一种方法是使用上面的 CSS，没有尝试过，但我不确定使用边框来发现元素是否容易。
另一种方法是在控制台中运行此 JS 代码以找到它们：
Array.prototype.filter.call(document.querySelectorAll('*'), function (node) {
return node.clientWidth + node.offsetLeft > document.documentElement.clientWidth
});
这将返回一个包含所有宽度 + 偏移量（距左侧的距离）大于 clientWidth 的元素的数组。
然后您需要检查这些元素并找出它们为什么会这样 - 在我的例子中，页脚有 width:100% 和 padding:10px，这导致其宽度比文档宽度大 20 像素。
有趣的是，这仅在 iPhone 上看到，而不是在 Android 上。
【讨论】：
我建议下载 Web Developer for Firefox 并打开 Outline > Outline Block Level Elements。
【讨论】：