wordpress - 不明白 Thedailyprophet.net 的溢出

Question

我不明白为什么该网站在移动设备上泛滥成灾。我添加了以下代码，但无济于事。

网站是 www.thedailyprophet.net - 我查看了多个解决方案和类似的文章。我似乎无法完全了解这里发生的事情，而且还没有聘请开发人员，这是我的下一个解决方案。

提前致谢

html {
max-width: 100% !Important; }

body {
overflow-x: hidden !Important;
margin: 0px !Important;
padding: 0px !Important;}

Answer 1

首先，非常酷的网站!!

好吧，我可以看到你有一个小罪魁祸首......

主要的 .container 类需要:

overflow: hidden

我认为这个罪魁祸首与页面和帖子标题上的炫酷动画有关，其中标题的各个字母都到达了可以阅读标题的最终位置。这些字母从页面 View 到最后一个位置是动画的，并且移动设备中的视口(viewport)水平滚动，因为字母的不透明度使它们在仍在网站宽度之外时可见。如果将 overflow: hidden 规则添加到容器元素，滚动条就会消失(几乎完全消失，请继续阅读)...

次要的罪魁祸首是菜单 .menu-the-daily-prophet-header-menu。有 margin 加上 100% 的宽度...去掉 margin-left 和 margin-right 就可以了。