Rollover sur un lien/image

Bonjour à tous,

ma question est toute simple, je souhaite faire un menu-rollover sur mon site web, en utilisant la technologie CSS, mais je n'y parviens pas, et la raison m'échappe! =)

Voici mon code html,

<div id="contenant">
<a href="#" title="accueil" id="menu1"><img src="images/menu1.png" width="69" class="menu1img" height="20"/></a>
</div>

Voici mon code css,

#site #contenant #menu1 { 
	display:block;
	background-image:url('images/menu1.png');
	width:69px;
	height:20px;
	border:none;
	position: absolute;
	top: 45px;
	left: 300px;
}
#site #contenant #menu1:hover, #site #contenant #menu1:focus{ 
	background-image:url('images/menu1-roll.png');
}

Où est charlie ? (où est l'erreur ? )

Merci à tous,

Salut,

Dès l'instant où tu souhaite faire un rollover sur une image présente dans le code html, il te faudra passer par javascript pour pouvoir substituer cette image à une autre.

Pour substituer une image de fond derrière un lien par une autre, à ce moment là il sera possible de le faire en CSS. Mais attention dans ce cas, pour que cela soit accessible, il faut que le lien soit en dur dans le code html.

Ok, je vais voir du côté de javascript!

merci