与高度相等列

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。