CSS 和 div 问题

Question

在我的 web 应用程序中我有这个 css 规则:

/*Header*/
#headerAbs{
    background-color: #63554c;
}

#headerAbs .header1{
    float: left;
}

#headerAbs .header2{
    float: right;
} 

和这个 HTML 代码:

<div id="headerAbs">
     <img class="header1" src="../../../../imagenes/header.jpg" alt="ARVC-UMH" />
     <img class="header2" src="../../../../imagenes/logoUsal.png" alt="ARVC-UMH" />
</div>

我的问题是 <img>元素的样式很好(如果我改变 float ，它们会移动)，但是 <div>背景没有改变。

我正在使用 Firebug ，如果我检查元素，<div id="headerAbs">未突出显示，这意味着由于某种原因未被考虑在内。我的应用程序中的另一个元素也有同样的问题。

我错过了什么吗？

提前致谢。

Answer 1

div 中的所有元素都是 float 的，因此您的 div 高度为空。您仍然可以:

• 为 div 的 CSS height 属性设置显式值；
• 在 float 元素之后添加 clear: both; block 在 div 内；
• 通过将 overflow: hidden 添加到它们的父元素 (#headerAbs { overflow: hidden; } ).