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

[Augustera 1]

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-->

[Marrabel 20]

O :hover que você jogou foi na tag "a", daí ele só irá preencher o espaço que a tag "a" ocupa.

 

Jogue o :hover na tag "li" e veja se resolve.

 

Espero ter ajudado.

 

 

 

[Augustera 1]

Opa deu certinho!

 

Muito obrigado pela ajuda.

[Augustera 1]

Ah e mais uma coisa caso alguem veja aqui... O link só ta funcionando na palavra do menu, como que eu faço pra funcionar na parte toda selecionada pelo hover??

 

O código ta no primeiro post

[Diéssica 140]

Coloca todas as formatações do "li" numa classe em a.

 

Assim:

<ul>
<li><a href="home.html" class="links_menu">Home</a></li>
<li><a href="home.html" class="links_menu">Home</a></li>
<li><a href="home.html" class="links_menu">Home</a></li>
<li><a href="home.html" class="links_menu">Home</a></li>
</ul>

 

E CSS, de:

#menu ul li{float:left; font:16px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFF; padding:14px 7px 0 10px;}

 

para:

#menu ul .links_menu {...

 

E o hover .links_menu:hover.

 

Mais ou menos isso, aí vai linkar o menu todo.

 

:)

[Augustera 1]

Deu certinho Diéssica *-*

 

pow brigadão *-*