背景未顯示在DIV與2個div Html

Question

我有一個「容器」DIV有2個浮動DIV與不同高度內，當我應用背景屬性的「容器」DIV它不工作。

<div id="container"> 
    <div id="left"></div> 
    <div id="right"></div> 
</div> 

http://jsfiddle.net/arthurg/XUmsU/

我怎樣才能顯示（使用CSS）的容器上的背景是什麼？

Answer 1

添加溢出：隱藏;到容器。像這樣：

#container{ 
    height:100%; 
    background:red; 
    overflow:hidden; 
} 

Answer 2

您需要清除浮動。

在這兩個浮動div後面加上這個<br style="clear: both"/>。

HTML：

<div id="container"> 
    <div id="left"></div> 
    <div id="right"></div> 
    <br style="clear: both"/> 
</div> 

http://jsfiddle.net/XUmsU/3/

沒有爲clearfix（with pseudo-classes :before and :after）其他（新）的方法。

Answer 3

http://jsfiddle.net/XUmsU/1/

<div id="container"> 
    <div id="left"></div> 
    <div id="right"></div> 
</div> 

#container{ 
    height:100%; 
    background:red; 
    overflow:hidden; 
} 

#left{ 
    width:100px; 
    background:green; 
    height:30px; 
    float:left; 
}