Question

我有一个网站，我曾经一直激活overflow: hidden;（你使用箭头滚动）。现在我有一些错误需要修复并且想要修改一些东西，所以为了让我更容易，我启用了滚动条。

在此之后我看到页面宽度超过100％（所有内容都设置为width: 100%;。问题是，这个空间不应该存在，即使我检查页面并将鼠标悬停在HTML和/或标签上，它们也不包括超过100％的空间。（也不是由边距/填充引起的）

显然，我可以用overflow-x: hidden;拒绝滚动条，但我不认为这是解决该问题的正确方法。我认为这个问题可能会导致一些错误。

当overflow: hidden;处于活动状态时，jQuery函数scrollTop()也不再起作用（Chrome），但在Edge上它可以。这对我来说似乎有点奇怪，因为jQuery应该操纵滚动，即使在隐藏时也是如此。

感谢您的帮助： - ）

Answer 1

如果您的父元素的宽度为100％这个孩子也是，那就没事了，但如果孩子有填充/边距/边框你的habe 100％+填充/边框/边距的像素这就是为什么你的页面宽度超过100％的原因。

Answer 2

即使我没有代码或网站来检查这是否正确。

我经常发现你可以拥有100％的div，也可以填充。

将整箱尺寸添加到整个网站是一个不错的主意，因此这些新增功能已合并：

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*, *::before, *::after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

为什么我的页面宽度超过100％并且在x轴上可滚动？

2 个答案: