將子div的寬度擴展到100％

Question

我在這裏遇到了一個問題，我之前沒有遇到過，似乎也沒有想到任何合理的解決方案，不需要a）拆分現有的佈局，或b）創建一個新的，怪異的佈局。

下面，我將演示我想要達到的目標。我已經很多次看到它在其他網站上：

<div class="MainContainerDIV" style="width: 960px; height: 100%;"> 
    <div class="SubDIV" style=width: fill up the browser viewport completely, even extending outside of the parent div; height: 150px;"> 
     <p>blah blah blah</p> 
    </div> 
</div> 

可能有人請給我一些指點，以我應該如何去正確的這個？

Answer 1

如果您將position: absolute應用於子div，它會將其從文檔流中移除，然後您可以指定100％的寬度。您可以在this jsfiddle中查看結果。要記住的一件事是，如果你將絕對定位或相對定位應用於父div，它將不再有效。