使用CSS使子DIV的宽度大于父div

Question

是否可以使子DIV 中的“宽度”大于父DIV中的“宽度”...（仅限css ）

有关详细信息，请参阅以下示例：

  

http://jsfiddle.net/6UFs4/

    <div id="main">
  <div id="sidebar">DIV1
        <div id="sidebar_2">DIV1 Sub</div>
  </div>
  <div id="page-wrap">DIV2</div>
</div>

#main
{ 
    display: block;
    width: 100%;
}
#sidebar    
{
    background-color: Aqua;
    float: left;
    width: 80%;
}

#sidebar_2    
{
    background-color: Lime;
}

#page-wrap  
{
    background-color: Gray;
}

DIV1 Sub 的大小应该是浏览器窗口的100％，不受父DIV的限制。我尝试使用溢出：可见，但它无效...

有什么想法吗？提前谢谢。

Answer 1

您可以使用position:absolute和width:100%;来满足您的要求，但必须注意元素的位置（x和y轴相对于页面），以便在所需位置显示图像

参见示例： http://jsfiddle.net/6UFs4/2/

Answer 2

是的，你可以改变它的定位。

jsFiddle

#sidebar_2    
{
    background-color: Lime;
    position:absolute;
    left:0;
    right:0;
}

Answer 3

只需将此css添加到您的子div：

#sidebar_2 {
    position:absolute;
    left:0;
    right:0;
}

演示：http://jsfiddle.net/6UFs4/4/