仅在Firefox上对WordPress主题进行水平滚动

Question

我的WordPress主题可以在除firefox以外的所有浏览器上正确加载-在我的所有页面上都可以水平滚动。

换句话说，我应该只能上下滚动，但是在Firefox上，我也可以左右滚动一点。

例如https://b2english.com/test/

任何提示都非常感谢。

布莱恩

Answer 1

问题出在thrv_wrapper的thrv-page-section

margin-left: -20px !important;
margin-right: -20px !important;

花十秒钟找到它...

Answer 2

尝试一下：

body {
    max-width: 100%;
    overflow-x: hidden;
}
[data-css="tve-u-15efc72e013"] {
    padding: 44px 0px 40px !important;
    margin-top: -10px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
}

由于某些……呃……Mozilla在设计Firefox时做出的决定，页边距为负数（例如margin-left: -20px;）显示有点时髦（又称水平滚动）。

希望有帮助。 ：）

Answer 3

滚动问题不仅限于Firefox，Chrome也会显示该问题：

Ashley的答案是正确的。负边距的奇怪用法引起了问题。您可能还希望从正文开始剥离所有多余的边距，然后将填充填充到单个父容器中。

也不建议在绝对定位的元素上使用黄色背景对第一部分进行着色...也不建议直接对第一部分进行简单着色。

此元素不提供任何内容：

<div class="tve-page-section-out" data-css="tve-u-15e3fa999e0"></div>

只需添加您的规则：

background-color: rgb(245, 215, 110);

给真正的父母：

<div class="thrv_wrapper thrv-page-section" style="" data-css="tve-u-15efc72e013">

像这样：

.thrv-page-section { background-color: rgb(245, 215, 110); }