移动浏览器：overflow-x 在视口右侧创建空白

Question

每当我编写一个可以一直缩小到手表大小的响应式网站时，视口右侧的空白区域就会溢出，从而启用水平滚动条。修复很简单：将主体包裹在一个 div 中，将其宽度设置为自动并将溢出设置为隐藏。我的问题是：这是你们很多人使用的常见做法/方法，还是你们很多人遇到的常见问题？有没有一种“更清洁”的方法？

我正在使用这个元视口标签：

<meta name="viewport" content="initial-scale=1.0, user-scalable=yes, width=device-width">

Answer 1

适用于某些情况（但不一定是所有情况）的一种更简洁的方法是在 BODY 容器上应用 overflow:hidden。

它可能不起作用的原因是，在某些情况下，未能捕获溢出的容器可能在 DOM 中更深。