CSS位置绝对全角问题

我有2个div和一个dl：

<div id="wrap">
 <div id="header">
  <dl id="site_nav_global_primary">

这是我的风格：

#wrap {
margin:0 auto;
width:100%;
min-width:760px;
max-width:1003px;
overflow:hidden;
}

#header {
width:100%;
position:relative;
float:left;
padding-top:18px;
margin-bottom:29px;
}

#site_nav_global_primary {    
float:right;
margin-right:18px;
margin-bottom:11px;
margin-left:18px;
}

现在，我想更改site_nav_global_primary使其具有全屏宽度，而无需更改换行和标题。但是当我尝试：

#site_nav_global_primary {    
position: absolute;
width:100%;
top:0px;
left:0px;
}

导航获得包装器的100％，最大宽度为1003px。我希望它可以扩展到最大而不更改wrap和header div。

这可能吗？

您可以将left和right属性都设置为0。这将使得在div拉伸到文档的宽度，但要求没有父元件被定位（这不是的情况下，看到#header是position: relative;）

#site_nav_global_primary {    
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

演示位于：http : //jsfiddle.net/xWnq2/，我position:relative;从#header

您需要添加position:relative到#wrap元素。

当您添加此元素时，所有子元素都将位于此元素中，而不是浏览器窗口中。

我有类似的情况。就我而言，它没有一个带有position：relative的父母。只需将我的解决方案粘贴到此处，以备不时之需。

position: fixed;
left: 0;
right: 0;

将#site_nav_global_primary其固定放置，并将宽度设置为100％，并设置所需的高度。

我不知道这是否是您想要的，但是尝试消除溢出：从#wrap隐藏