html - 导航栏不会完全覆盖屏幕

我已尽力搜寻，但似乎找不到答案，可能是我没有使用正确的关键字。

无论如何，我制作了一个简单的导航栏，并将其设置为100％的宽度，但它不会覆盖屏幕的最右侧。我尝试使用right：-5px;但这没有帮助。

这是jsfiddle，因此您可以看到我的代码。

http://jsfiddle.net/xBkma/

CSS：

 #nav {
width: 100%;
float: left;
margin: 0 0 0 0;
padding: 0;
background-color: #F3B33C;
border-bottom: 4px solid #ccc;
position: absolute;
top: -1px;
left: -5px;
margin-right: -5px;
}

的HTML

<div id="nav">
    <ul>
    <li><a id="home" href="index.html"> <img src="images/black home.png" width="28" height="28"></a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Forum</a></li>
    <li><a href="#">Database</a></li>
    </ul>
    </div>

最佳答案

首先，使用position: absolute;时不需要浮动

其次，进入导航，首先需要重置浏览器默认样式表，您可以简单地使用此

* {
   margin: 0;
   padding: 0;
}

稍后将left: -5px;从left: 0;更改为#nav，您就可以开始了

Demo