[Resolvido] Menu hover não funciona como eu quero

E aí galera, é a primeira vez que venho postar aqui, sou iniciante e estou desenvolvendo meu primeiro site e estou com um problema para fazer o hover dentro do menu. O hover não pega a barra do menu referente a palavra, só na palavra (ex: home.. só funciona em cima da palavra e ao redor não acontece nada)... Alguem poderia me ajudar com isso?.. meu código CSS do menu está aí em baixo.

#menu{height:50px; background:url(images/bg_menu.jpg) repeat-x;}
#menu ul{list-style:none; margin:0; padding:0; text-transform:uppercase;}
#menu ul li{float:left; font:16px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFF; padding:14px 7px 0 10px;}
#menu ul li a{float:left; text-decoration:none; font:16px Tahoma, Geneva, sans-serif; color:#FFFFFF;}
#menu ul li a:hover{background:#069;}

Aqui o código do menu:

 <div id="menu">
 <ul>
 <li><a href="#">Home</a></li>
 <li><a href="#">Projetos</a></li>
 <li><a href="#">Grupo</a></li>
 <li><a href="#">Faça Parte</a></li>
 <li><a href="#">Contato</a></li>
 </ul>
 </div><!--menu-->