Css 左浮动隐藏背景色？

由于

float:left

出现问题，我打算将鼠标悬停在导航栏上，而不留左侧的间隙，我可以使用

float:left

解决这个问题，但一旦我将

float:left

添加到我的

#topnav ul li a

中，它似乎会删除背景色？以下是我当前的css：

body {background-color:#CDCDCD;}
h1 {font-family:arial, Geneva, sans-serif;}
h2 {font-family:arial, Geneva, sans-serif;}
li {list-style:none;}
a:link { text-decoration:none;  }
#container {width:900px; margin:0px auto; background-color:#FFFFFF; border:1px solid grey;
#top  { background-color:#000000; width:100%; padding:10px 0; overflow:hidden; }
#logo { margin:0 0 0 10px; float:left; }
#social-media   {float:right; margin:15px 0px 0px 0px;  }
#social-media p {color:#ffffff; margin: 0px 0px 0px 25px; }
#social-media img { width:24px; height:24px; margin:0px 5px 0px 0px;   }
#social-media ul li { display:inline; }
#topnav { background-color:#333333; clear:both; width:100%; }
#topnav ul { margin:0px; background-color:#333333; }
#topnav ul li { display:inline; }
#topnav ul li a { padding:10px 20px; font-family:Verdana, Geneva, sans-serif;   display:inline-block; }
#topnav  a:link { color:#ffffff; }
#topnav  a:visited { color:#ffffff; }
#topnav  a:active { color:#ffffff;  }
#topnav  a:hover { color:#ffffff; background-color:#770000; }
#topnav  a:focus { color:#ffffff; }
#footer { width:100%; background-color:#333333; float:left; }
#footer p { text-align:center; color:#ffffff; font-size:12px; }
#footer a:link {color:white;}

---

可能是浮动容器的父元素上有一个

溢出：auto

。#容器选择器缺少一个右括号作为开始。但若你们能提供一些和CSS一起使用的示例标记可能会有所帮助，而且看起来aurel是正确的。将

溢出：auto

添加到

#topnav ul

似乎可以恢复背景色。