高度匹配容器

Question

我有當容器容納側邊欄的佈局。我需要側欄與容器的高度完全相同。請參閱this site其中側邊欄是#leftbar和容器是#container

如果你看看網站，你會明白我的意思。我需要一個純粹的CSS解決方案或jQuery解決方案。要記住的導航

一個重要的事情是垂直手風琴，所以被點擊某些按鈕時，側邊欄，#leftbar將垂直擴展。解決方案需要適應增長，所以簡單地使用jQuery來匹配它們的高度並不是一個可行的解決方案。

Answer 1

添加以下性能在這些元件：

#cotainer { 
    position: relative 
} 

#leftbar { 
    position: absolute; 
    top: 0; 
    bottom: 0; 
} 

#righthome { 
    margin-left: 270px; /* looks to be about the width of the leftbar */ 
} 

給予#leftbar性質表明，將確保頂部粘到下一個父元件的頂部與position: relative，與同爲底部邊緣。

但是這有一個副作用。 #righthome元素成爲其父項框佈局模型中的第一項，因此與左側欄重疊。爲了解決這個問題，你給它一個左邊距，把它放回原來的位置。當然