CSS：宽度 100% 不是屏幕的 100%答案

【问题标题】：CSS: Width 100% is not 100% of ScreenCSS：宽度 100% 不是屏幕的 100%
【发布时间】：2011-09-30 21:38:01
【问题描述】：

在我的sandbox site 顶部有一个白条。它包含在正文中（具有背景图像），导航栏样式为

#topnav4 {background: #fff;  width: 100%; height: 70px;  }

但是栏没有到达屏幕的边缘。此外，我没有设置任何边距或填充。有谁知道如何解决这一问题？

更新，还请注意，导航栏不在屏幕的最顶部。导航栏顶部和页面顶部之间有空间。我该如何摆脱它？

更新，我添加了这段代码，但问题仍未解决

#topnav4 {背景：#fff;位置：绝对；左：0px；顶部：0px；宽度：100%；高度：70px； }

【问题讨论】：

标签： css

【解决方案1】：

您可能需要将正文的边距和内边距设置为 0。

body {
    margin: 0;
    padding: 0;
}

【讨论】：

【解决方案2】：

将以下内容添加到 CSS 文件的顶部，然后阅读有关 CSS 重置的内容：

* { margin: 0; padding: 0; }

以下是一些我觉得很有帮助的资源：

【讨论】：

【解决方案3】：

您要查找的 sn-p 是：

html, body {
    margin: 0;
    padding: 0;
}

这将删除所有浏览器中的默认用户代理“页边距”。

删除基于 position: absolute 的添加 - 这不是解决此问题的最佳方法。

【讨论】：

@滚石；只是他指出了这个立场：绝对不是解决 OP 问题的最佳方法。当时，他比我们任何人都拥有更多。嗯，我刚查了一下时间，他们都说18分钟前回答了（除了Guffa，他来晚了一点）......
@Paul Vitti：他比我早 39 秒（悬停在?? mins ago）。
@Paul Vitty 不用担心，一切都很好。我实际上认为你是第一个回答的，但只是一点点:)
@thirtydot 确实如此。我也 +1 以获得最彻底的答案。
对不起，@滚石。 - 我不知道您可以将鼠标悬停在时间上以获取秒数。

【解决方案4】：

您的页面上没有 doctype，因此它将以 Quirks 模式呈现。这意味着浏览器会尝试与旧版本的浏览器兼容。

这对 IE 来说尤其糟糕，它还会使用非标准的盒子模型：http://en.wikipedia.org/wiki/Internet_Explorer_box_model_bug

【讨论】：

【解决方案5】：

帮我解决了。

min-width:100%

【讨论】：