集裝箱股高不調整大小？

我知道有一百個關於自動調整div高度的問題，但沒有任何建議似乎對我有用，這導致我相信我錯過了一些明顯的東西。基本上我有一個容器Div，然後是另一個更小的div（絕對定位），並且我有一個X有關創建（相對定位）的div盒的一面。問題是主容器div的高度不會隨着它伸展。任何幫助？謝謝！集裝箱股高不調整大小？

.mainContainer{ 
    position: relative; 
    width:800px; 
    height:auto; 
    padding-top:10px; 
    margin-left: auto; 
    margin-right: auto; 
    border-style:solid; 
    border-width:2px; 
} 
.smallerDivInsideMainDiv{ 
    position:absolute; 
    left: 20px; 
    top: 50px; 
    width: 600px; 
} 
.divsThatAreOverflowing{ 
    position: relative; 
    margin-top:20px; 
    border-style:solid; 
    border-width:1px; 
}

來源

2012-03-17 Adam Ashwal

你爲什麼使用絕對位置？ – Jared 2012-03-17 01:50:37

據我所知，你不能有一個內部的相對定位絕對定位的元素元素並嘗試將父高度調整爲絕對子元素。如果您僅將它用於左右定位，請改用邊距。

<style> 
.mainContainer{ 
    width: 800px; 
    height: auto; 
    padding-top: 10px; 
    margin-left: auto; 
    margin-right: auto; 
    border-style: solid; 
    border-width: 2px; 
    background: #999; 
} 
.smallerDivInsideMainDiv{ 
    margin-left: 20px; 
    margin-top: 50px; 
    background: #CCC; 
    width: 200px; 
} 
.divsThatAreOverflowing{ 
    margin-top: 20px; 
    border-style: solid; 
    border-width: 1px; 
    background: red; 
    height: 300px; 
    width: 100px; 
} 
</style> 

<div class="mainContainer"> 
    <div class="smallerDivInsideMainDiv"> 
<div class="divsThatAreOverflowing"></div> 
    </div></div>

enter image description here

這裏母體是深灰色，而較小的DIV中是淺灰色，與溢出DIV爲紅色。當它改變高度時，它的兩個容器都會調整。

來源

2012-03-17 02:10:00

太棒了，謝謝！ – 2012-03-17 02:24:33

您應該使用相對位置的smallerDivInsideMainDiv太和主DIV將與包含的div的總大小（用他們的利潤太）自動調整大小，但它會忽略你的「頂部：50像素;」。對於您可以smallerDivInsideMainDiv後面加一個空div

<div style='height: 50px;'></div>

同時還在mainContainer上，是這樣的：

.smallerDivInsideMainDiv{ 
    position:relative; 

<div class="mainContainer"> 
    <div class="smallerDivInsideMainDiv"> 
     <div class="divsThatAreOverflowing">x1</div> 
     <div class="divsThatAreOverflowing">x2</div> 
    </div> 
    <div style='height: 50px;'></div> 
</div>

來源

2012-03-17 01:59:47 Shocker

集裝箱股高不調整大小？

回答

相關問題