我有一个导航栏（#nav_bar），它具有以下CSS属性：
#nav_bar {
background: url(../images/navbar.png) repeat-x;
width: 100%; height: 50px;
margin-bottom: 20px;
}
#wrap的宽度为1024px宽且margin: auto;，但我想将其展开，以使其适合所有屏幕尺寸100%。我试图设置width: 500%;只是为了看它会做什么，然后我意识到它从左边扩展 - ＆gt;是的，而不是从中心两个方向。
所以，我要问的是;
是否可以从中心扩展元素 也许我可以设置
max-width属性或使用javascript 找出访客屏幕分辨率，然后分配宽度 那里;没有严重的低效率，即延长加载时间/跨浏览器兼容性问题？
Just for reference, a link to the particular page I'm talking about
任何答案都将非常感谢;）！
答案 0 :(得分：1)
为什么不使用CSS3 Media Queries来了解客户的屏幕尺寸。
如果您的#nav-bar是块级元素，例如div，ul或p元素，那么default将占用其容器的整个宽度。因此，您无需在那里设置width: 100%;。此外，您可以使用text-align: center;对内容进行居中对齐。
在您的情况下，您可以使用绝对定位和溢出：可见属性，并设置菜单的宽度。此外，您可以简单地从包裹中提取#nav-bar，让它占据整个空间。
答案 1 :(得分：1)
只需将#nav_bar移出#wrap即可。
另外，您可以在CSS中使#nav_bar拥有position: absolute; left: 0px; width: 100%;，这也可以。
答案 2 :(得分：0)
使用margin: auto
您可以在此处查看示例：http://jsfiddle.net/s995c/4/