为什么我的背景颜色没有应用？

Question

我正在努力解决为什么我的background-color没有出现。我猜它与浮动有关，但我不确定为什么或造成它的原因。

http://jsfiddle.net/K4Sw9/

Answer 1

您需要添加

<div style="clear:both;"></div> 

关闭#header-social之前

。

Answer 2

#header-social-inner:after {
   display:block;
    clear:both;
    content:'';    
}

您可以添加一个清除伪元素的伪元素，这样您就不必更改标记。

http://jsfiddle.net/8Nz3z/

实际上，我更喜欢这个：

#header-social:last-child:after {
   display:block;
    clear:both;
    content:'';    
}

http://jsfiddle.net/8Nz3z/1/

Answer 3

只是给一个高度。像这样：

#header-social {
    background-color: #111;
    height: 125px;
}