overflow:hidden 无助于防止水平滚动

Question

一般来说，overflow:hidden 解决了我所有的水平滚动问题，但在下面的情况下它没有，而且它还禁用了垂直滚动。

如果您标记文本并向左拖动屏幕视图（响应时），您将能够看到水平滚动问题。这是 link:

http://nexus.techsaran.com/

Answer 1

这是因为您有一个硬编码宽度为 728 像素的 adsense 块。

因此，只要视口小于 728 像素，这个 div 就会超出页面的右边缘，因此会出现水平滚动条。

编辑

Can you please tell me where you've found it

在这段代码中

<div style='text-align:center'><div class='adsense' style='display:inline-block;width:728px;height:90px;'>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 728x90 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-5337874066772271"
     data-ad-slot="6784283332"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>

每当您像您描述的那样进行水平滚动时，通常表示存在太宽的元素，这正是我要找的。在这种情况下，如果您缩小 window，您实际上会发现广告太宽了。我使用 web inspector（类似于 firebug）来确认。

有时您实际上看不到导致问题的元素。在 Web 检查器中，如果您将鼠标悬停在代码视图中的某个元素上，它将在页面视图中突出显示，因此这会有所帮助。

仅供参考，有多种方法可以在响应式网站上使用 Adsense。 Checkout this link 让你开始

祝你好运！

overflow:hidden 无助于防止水平滚动

overflow:hidden won't help to prevent horizontal scrolling

horizontal-scrolling

responsive-design