[Résolu] Menu CSS avec onglets de differentes couleurs (a:hover)

Bonjour à tous.
Voilà, j'essai de faire un menu en CSS à fond blanc mais une fois la sourie sur la case que un background-color apparaisse. Jusque là je n'ai pas de problème mais je voudrais que chaque onglet est une couleur différente donc j'ai testé ceci :
Bien evidement ça ne marche pas. Auriez vous une solution a me proposé ?

<div id="menu">
<table>
<tr>
	<td id="1"><a href="index.html" style="display: block; height:auto; width:100%;">Acceuil</a></td>
	<td id="2"><a href="presentation.html" style="display: block; height: auto; width: 100%;">Pr&eacute;sentation</a></td>
	<td id="3"><a href="membres.html" style="display: block; height: auto; width: 100%;">Membres</a></td>
	<td id="4"><a href="publications.html" style="display: block; height: auto; width: 100%;">Publications</a></td>
	<td id="5"><a href="seminaire.html" style="display: block; height: auto; width: 100%;">S&eacute;minaire</a></td>
	<td id="6"><a href="stages.html" style="display: block; height: auto; width: 100%;">Stages</a></td> 
	<td id="7"><a href="contact.html" style="display: block; height: auto; width: 100%;">Contact</a></td> 
	<td id="8" ><a href="liens.html" style="display: block; height: auto; width: 100%;">Liens</a></td>
</tr>
</table>
  </div>

td {
	border : 1px solid black;
	background-color:white;
	text-align: center;
	font-family : Verdana,Arial,Helvetica,sans-serif;
	width:12.4%;
	}
	
table td#1 a:hover {
		background-color:red;
		}
table td#2 a:hover {
	background-color:green;
	}
	

table
{
   border-collapse: collapse;
   width:100%;
   display:block;
   height:auto;
}

Modifié par Fer2Lance (10 Oct 2010 - 17:52)

bonjour,

Peut-être est ce du au fait que la première lettre d'une "classe" ou d'une "id" , ne peut être un chiffre ou un caractère spécial.JE ne vois aucune autre raison (sauf si vieux navigateur).

Essai de nommer tes "id" comme ceci par exemple : #td1 a:hover {} - <td id="td1"><a></a></td>

gc

Yes ! Merci gc-nomade !
Ca marche nickel !