與高度相等列

Question

這個問題是我的CSS：

#contents { clear: both; width: 900px; background: #fff url(../img/contents_bg.jpg) repeat-y; } 
#contents .left { float: left; width: 615px; padding: 10px 0 0 20px; } 
#contents .right { float: right; width: 225px; padding: 10px 20px 0 0; } 

和HTML：

<div id="contents"> 
<div class="left"> 
    <p>test</p> 
</div> 
<div class="right"> 
    <p>test 2</p> 
</div> 
</div> 

出於某種原因，contents_bg.jpg背景圖像不會出現，除非我把一個高度上＃我不能做的內容，有什麼想法？

Answer 1

你的div＃內容不浮動，因此不延伸到包含其浮動的內容。 Floatutorial是一個很好的閱讀。還有其他解決方案可用，但大部分都包括引入一些不必要的標記，如div＃內容底部的清除div。