如何使用另一個div的高度自動設置div的高度

Question

我還有一個關於css自動調整內容大小的問題。我在旁邊有三個div，都需要是相同的長度，但是這個長度是由最長的div設定的，而不是永久的。我試圖做一些類似於我在前面提到的（How to make a div's width stretch between two divs）問題中的答案，但沒有成功地設置div的高度。

三個div是設定的寬度。

HTML：

<div id="content"> 
    <div id="bodySideBar"> 
     a 
     <br><br><br> 
     b 
    </div> 
    <div id="bodyUpdateBar"> 
     a 
     <br><br><br><br><br><br><br><br><br> 
     b 
    </div> 
    <div id="bodyContent"> 
     a 
     <br><br><br><br><br><br> 
     b 
    </div> 
</div> 

CSS：

#content { 
    width: 100%; 
    height: 100%; 
    padding: 0; 
    margin: 0; 
    display: inline; 
} 

#bodyContent { 
    display: block; 
    float: none; 
    width: auto; 
    height: 100%; 
    background: #FFC273; 
} 

#bodySideBar { 
    display: inline-block; 
    float: left; 
    width: 50px; 
    height: 100%; 
    background: #BF8130; 
} 

#bodyUpdateBar { 
    display: inline-block; 
    float: right; 
    width: 200px; 
    background: #FFCA40; 
} 

的jsfiddle：http://jsfiddle.net/ueXR9/

注：我把
S IN表明，其他部分沒有被強制調整到最長的div。另外，如果您有任何不明白的地方，我很抱歉，因爲我的睡眠時間不足5小時，無法集中一半時間。

Answer 1

也許它可能與顯示：表。

http://jsfiddle.net/ueXR9/1/

CSS：

#content { 
    width: 100%; 
    height: 100%; 
    padding: 0; 
    margin: 0; 
    display: table; 
} 
#bodyContent { 
    display: table-cell; 
    float: none; 
    width: auto; 
    height: 100%; 
    background: #FFC273; 
} 
#bodySideBar { 
    display: table-cell; 
    width: 50px; 
    height: 100%; 
    background: #BF8130; 
} 
#bodyUpdateBar { 
    display: table-cell; 
    width: 200px; 
    background: #FFCA40; 
} 

HTML：

<div id="content"> 
    <div id="bodySideBar">a 
     <br> 
     <br> 
     <br>b</div> 
    <div id="bodyUpdateBar">a 
     <br> 
     <br> 
     <br> 
     <br> 
     <br> 
     <br> 
     <br> 
     <br> 
     <br>b</div> 
    <div id="bodyContent">a 
     <br> 
     <br> 
     <br> 
     <br> 
     <br> 
     <br>b</div> 
</div>