html、正文和 div 设置为 100% 宽度，但它仍然没有占用全部 100%

Question

我将边距和填充重置为0 。 我将<html>和<body>宽度设置为 100%。

我的 CSS 看起来像这样：

html, body { 
    margin:0;
    padding:0;
    width:100%;
}

#wrapper {
    margin:0;
    padding:0;
    width:100%;
    background-color:#ccc;
}

每当我将浏览器调整到水平滚动条的位置时，div 不会占据完整的 100% 宽度。 甚至没有正文或 html。 我已经对其进行了 firebugged，并且有大约 180px 的差距。

在此处输入图像描述

Answer 1

您可以为此使用溢出

html, body { 
margin:0;
padding:0;
width:100%;
height:100%;
overflow: auto;
}

我也遇到过类似的问题，我用过这个

Answer 2

简短回答：

更长的答案：

正如 Dan Kanze 所说，如果存在一致的间隙，则意味着包装器内部的某些元素导致了偏移。

为了进一步帮助您，我建议您使用一个不错的开发工具，您可以在 Chrome Chrome devtools screenshot和 FF FF devtools screenshot上找到它。

快捷键：Chrome = Ctrl + Shift + I Firefox = Ctrl + Shift + C

一旦你使用了它，你只需要将光标指针放在间隙上，然后将它悬停在垂直间隙上直到它找到东西，然后单击你就会找到坏的 html 家伙！

Answer 3

如果始终存在 180 像素的间隙，则表示包装器内部的元素导致了偏移。

您的容器元素看起来不错。

为了找到罪魁祸首，FF 有一个非常棒的调试工具，它就是 3D 模式。 这将向您显示主容器中的异常值，您可以在其中选择和查找代码中的元素。

通过链接，我可以进一步帮助您。