为什么用这个CSS背景颜色属性不起作用？

<body> 
    <div> 
     <div id="ROOT" > 
      <div id="ROOT_0" > 
       header 
      </div> 

      <div id="ROOT_1" > 
       main 
      </div 

      <div id="ROOT_2" > 
       footer 
      </div> 
     </div> 
    </div> 
</body> 

html {height:101%;} 
body {background:#FFFFFF;} 

#ROOT{ background-color:#666666; width:980px; margin-left:auto; margin-right:auto;}  
#ROOT_0{background-color:#FF9933; width:970px; text-align:center; float:left; margin-top:5px; margin-bottom:5px; margin-left:5px; margin-right:5px;}  
#ROOT_1{width:980px; text-align:center; float:left;}  
#ROOT_2{background-color:#FF9933; width:970px; text-align:center; float:left; margin-top:10px; margin-bottom:5px; margin-left:5px; margin-right:5px;}

IE获得正确的背景。如果我尝试使用Chrome或Firefox，则不会获得背景。为什么？欢呼声为什么用这个CSS背景颜色属性不起作用？

来源

2010-10-13 markzzz

浮动元素不会影响其容器的高度。您在IE中遇到错误，因为您没有触发标准模式是一种相当现代的Doctype。

请参阅complex spiral了解为什么事情以这种方式工作，Ed Elliot's blog为许多更好的方法来计算浮标的高度。

来源

2010-10-13 14:04:36 Quentin

uhm。如果我写float：left;在#ROOT上，我可以看到背景变化。但是，主要的股利走向左侧，并没有更多的中心:( – markzzz 2010-10-13 14:07:24

你的答案是在他的文章中，尝试阅读它们 – Tim 2010-10-13 14:10:23

所以不要浮动根！还有其他的方法，你选择了第四名爱的博客我一般会使用自己的溢出方法 – Quentin 2010-10-13 14:10:35

尝试为div分配高度。

来源

2010-10-13 14:05:58

为什么用这个CSS背景颜色属性不起作用？

回答

相关问题