Html 浮动似乎可以去除背景色

我正在尝试创建导航菜单，并添加了

float:right

对于css中的

li

标记，我还有一个名为

.header

的div，它恰好是菜单的背景

出于某种原因，当我添加浮动时，背景就消失了，当我删除浮动时，背景又回到了他的位置

body{
    margin: 0;
}

.header{
    width: 100%;
    height:  10%;
    background: #616161;
}
ul#nav{
    list-style: none;
}
ul#nav li{
    display: inline-block;
    padding-right: 25px;
    float: right;
}

HTML

我的代码是纯的，没有css，没有边距，只有可能导致背景定位问题的显示

是否有可能将文本保持在正确的浮动和背景中

浮子使用前后：

---

在

之前把这一行放好

---

正如@MaryMelody-

所建议的，一个jsfiddle来演示这个问题将有所帮助至

.header

能否提供

.header

的HTML结构？另请查看：♦ 最好仔细检查这些回答。这个问题是一个完全重复的问题。我已经尝试了这个代码，并将其放在下面。header div，它不会改变任何东西。谢谢@MaryMelody，它成功了。它正在这里工作，或者您可以添加溢出：隐藏；如@Mary Melody所述，发送至.header

<div class="header">
 <ul id="nav">
   <li><a href="#">Website</a></li>
   <li><a href="#">Home</a></li>
   <li><a href="#">test</a></li>
   <li><a href="#">test</a></li>
   <li><a href="#">test</a></li>
 </ul>
</div>

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

.header {overflow:hidden;}