Html 在Mozilla上用右边空白隐藏滚动条会弄乱内容

因此，我用以下代码在Chrome上隐藏了我的滚动条：

 ::-webkit-scrollbar {
    width: 0px;
    background: transparent; 
  }

我发现在Firefox中隐藏它的最好方法是设置正确的边距：-16px在父分区上。在Firefox中，这看起来很棒。然而，问题现在出现在Chrome中，因为它将父div中的整个内容向右移动。如果我试图通过在父div内的容器中添加marginright:16px来修复它，那么它会把Firefox中的事情搞砸

我肯定你以前遇到过这个问题，但是我能做些什么来解决这个问题吗？有什么已知的解决方案吗？

---

谢谢

您可以只为chrome提供填充

::-webkit-scrollbar {
    width: 0px;
    background: transparent; 
    -webkit-padding-end: 16px;
  }

或者只需设置

-webkit padding end:16px。

你也可以在Firefox上使用同样的想法，只需设置这个

@-moz-document url-prefix() {
    parent div {
        margin-right: -16px;
    }
}

所以利润率只有Firefox，你不需要做任何改变

@-moz scrollbars none如果你去查看Mozilla扩展部分，它会说“-moz scrollbars none”是“一个过时的API，不再保证工作。”最好使用一种更稳定的方法。
如果你只是想直观地隐藏滚动条，并且仍然允许用户用鼠标或键盘滚动，您可以尝试以下css：

html {
    overflow: -moz-scrollbars-none;
}

首先，你想隐藏你的滚动条但仍然滚动到你的页面吗？如果你只是想在视觉上隐藏滚动条，并且仍然允许用户用鼠标或键盘滚动，你可以尝试以下css:
html{overflow:-moz scrollbars none；}
@brian17han有效！我真不敢相信我哪儿都找不到。无论我去哪里看，他们都建议用右边的空白把它藏起来。你能不能把它贴出来作为一个答案，这样我就可以接受它作为一个正确的答案？