使用float：left时CSS背景消失 [英] CSS background disappears when using float:left

问题描述

这是我的html：

<div class="header_wrapper">
       <div class="main_nav">
       <div>TEst</div>
       <div>TEst</div>
       <div>TEst</div>
    </div>
    <div class="clear"></div>
</div>

正如你所看到的，我想创建一个带有浮动div的菜单。这样，main_nav的背景就会消失。

As you can see I want to build a menu with floating divs. Doing so the background of main_nav disappears.

.header_wrapper{

    height:129px;
    background:url('images/layout/header.png') no-repeat #1f1f1f;
    border-bottom:1px solid #1f66ad
}

.header_wrapper .main_nav{
    position:relative;
    top:77px; left:336px;
    width:750px;
    background:red;
}

.header_wrapper .main_nav div{
    float:left;
}

.clear{
    clear:both;
}

我试图使用clear：两者，但背景仍然没有。任何想法为什么？

I tried to use clear:both, however the background is still gone. Any ideas why?

推荐答案

添加 overflow：auto; 到main_nav带背景回来。

Adding overflow:auto; to main_nav brings the background back.

这篇关于使用float：left时CSS背景消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！