Html 缩放时，水平导航栏不跨越整个页面宽度

虽然我知道我的问题是什么，但我不知道该怎么解决。我有一个导航栏：

<div class="nav">
    <a...
    <a...
</div>

目前，这提供了84%宽度的导航栏，但背景图像不会超出此宽度。这里的“解决方案”是将导航div包装在另一个具有背景属性和100%宽度的div/span中

当然，当您放大并启用“像素设置最小宽度”时，页面宽度将超过100%，因此导航栏背景将停止超过该长度

---

我不知道怎么解决这个问题。无论缩放、浏览器宽度或分辨率如何，如何使导航栏的背景覆盖整个页面宽度？

宽度的重要意义是什么：84%？为什么不直接使用

宽度：100%

？在更大的显示器上以100%宽度显示任何页面都会使阅读成为某些页面布局的噩梦。84%的要点是在页面的两边留出8%的间隙，这样可以缓解这个问题。添加最小和最大宽度将允许不同大小的屏幕具有足够的宽度，以防止内容变小并可能破坏页面，同时允许间隙减小到零，以便在实际需要整个宽度的较小屏幕上没有间隙。对，但是在

.nav

上设置100%宽度只会使其填充其容器的宽度（无论是

还是其他），实际上不会增加页面的宽度。不，但是如果设置了最小宽度，小屏幕/宽度或放大的页面将超过100%。本质上，导航栏的100%宽度将仅为100%屏幕宽度，即使存在水平溢出。移动水平滚动条一点点，你就会看到导航条背景只停留在原来可见宽度的宽度上…如果这一切都有意义的话。。。

.nav{margin:0 auto;padding:10px 0;max-width:1280px;min-width:800px;width:84%;background:#000 url('../images/navBG.png') repeat-x;font-weight:bold;border-top:1px solid #BBB;border-bottom:1px solid #BBB;color:#FFF;}
.nav a{padding:10px;border-left:1px solid #000;border-right:1px solid #555;}