絕對元素寬度100％忽略填充內容框

Question

我在相對容器中有絕對元素。絕對元素有它的width:100%，它給出了相對容器元素的寬度。

我的目標是讓絕對元素伸展超過容器的100％，從左到右40px。

我試圖通過在相對容器上設置pading left & right to 40px以及box-sizing: content-box;來實現。問題是絕對元素不能拉伸到相對容器的100％。相反，它只在內容空間內伸展，而不包括填充。

編輯 原來，這只是在Chrome中。

Answer 1

喲你需要在這裏使用jQuery來計算帶有填充的DIV的寬度。基本上我們需要應用。 DIV的outerWidth()表 -

演示 - http://jsfiddle.net/GDU7Q/

希望這有助於！

Answer 2

只需添加width:132%;和left:0px;

fiddle

Answer 3

如果你設置你的填充，以40PX它願意相信絕對div的開始是從相對div的左側的每個方面，你需要設置了負餘量

<div class="outer"> 
    <div class="inner"> 
    </div> 
</div> 

.outer { 
    position:relative; 
} 

.inner { 
    position:absolute; 
    width:100%; 
    padding:0 40px; 
    margin-left:-40px; 
} 

fiddle