Hola a todos.
He echo un menu en css con listas.
Aquí esta el codigo html.
<div id="menu">
  <ol>
    <li ><a href="#"="inicio"><span>Inicio</span></a></li>
    <li><a href="#" id="team"><span>team</span></a></li>
    <li ><a href="#" id="media"><span>media</span></a></li>
    <li ><a href="#" id="eventos"><span>eventos</span></a></li>
    <li><a href="#" id="tienda"><span>tienda</span></a></li>
  </ol>
</div>
 
Y este es el código css.
#menu{
	position:absolute;
	margin-left:25px;
	width:700px;
	height:auto;
	top: 330px;
	z-index: 2;
}
#menu ol{
 
margin:0px;
padding:0px;
list-style:none;
}
#menu li{
padding:0px;
float:left;
margin-left: 5px;
margin-right: 10px;
 
 
}
#menu li a{
	display:block;
 
	text-align:center;
 
 
 
}
 
#menu li a:hover{
 
display:block;
}
#menu li span {
display:none;
}
#inicio{
display:block;
height:22px;
width:55px;
background-image:url(img/inicio1.png);
}
#team{
 
display:block;
height:22px;
width:49px;
background-image:url(img/team1.png);
}
 
 
El tema es que no consigo que, cuando pasas el ratón por encima de un <li> que contenga el id 'team' por ejemplo, se cambie el fondo.
Alguien tiene alguna idea de como hacerlo?
Muchas gracias. Un saludo;) 
  
 
