嵌套塊擴展高度父容器

我有2個div元素並排設置爲嵌入塊。他們都居住在一個包含div。我已將右側div設置爲100％高度，但因爲包含div的高度是動態的，所以不會展開。有誰知道如何使右手div（coulmn）擴展到包含div的動態高度？嵌套塊擴展高度父容器

<div class="container"> 
<div class="left_column">Dynamic Content In Here</div> 
<div class="right_column">Side bar to expand to the height of the containing div</div> 
</div>

感謝

奧利弗

來源

2011-12-10 ORStudios

嗨問題是與包含div的高度是動態的。這個想法是爲了左手div中的內容來推動包含div的內容。沒有設置高度屬性時，右手div不會展開到包含div的動態高度。 – ORStudios

我想你搜索是這樣的：

.container { 
    min-height: 700px; 
} 

.right_column { 
    min-height: inherit; 
}

也看到這個jsfiddle 。

來源

2011-12-10 15:15:53 scessor

非常感謝，已經工作:)！ – ORStudios

右列有多行文字時不工作http://jsfiddle.net/ssuS6/166/ – tarikakyol

嘗試添加：

html, body 
{ 
    height:100%; 
} 

#container 
{ 
min-height:100%; 
}

來源

2011-12-10 14:57:41 allaire

我有一個700px的最小高度設置爲容器，但在行內塊div的高度100％被忽略 – ORStudios

如果我設置高度700px它的工作原理，如果我設置最小高度它將被忽略。 – ORStudios

在遇到同樣問題的一些問題後，我認爲最簡單的解決方案是使用table-cell作爲顯示屬性。它工作得很好！

來源

2012-08-03 12:05:55 Thomas

嵌套塊擴展高度父容器

回答

相關問題