Discussion :

[Emcy]

bonjour,

je voudrais lorsque je passe mon pointeur de souris sur une ligne de mon tableau que les couleurs de tous mes éléments <td> soient modifiés

J'arrive à changer la couleur d'une case :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
td:hover {
	background-color: black;
}

mais pas de la ligne complète

[Auteur]

bonjour,

déjà ce bout de code ne fonctionnera pas sous IE. En effet la pseudo classe hover ne fonctionne que sur les balises <a>.


Maintenant pour changer la couleur des td d'une ligne change la couleur du conteneur des td à savoir le tr

[Emcy]

effectivement ça ne marche po sous IE6 (mais ça fonctionne sous IE7) : ce n'est pas trop grave, ça fera juste un peu moins zolie (grrhhh IE6)...

avec tr, ça ne marche pas
voici mon css de mon tableau :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
table{
padding:0;
margin:2px;
font-size:0.9em;
border-collapse:collapse;
border:none;
background-color:#b9bce6;
color:#00039e}
 
th{
font-weight:bold;
background-color:#b9bce6;
color:white;
font-weight:bold}
 
th, td{
border:2px solid white;
text-align:center;
padding:0.1em 1em;
margin:0}
 
 
td{background-color:#ebecf6}

[Bisûnûrs]

Et il est où le tr:hover dans ton code CSS ?

[Emcy]

je n'ai mis que mon code de base.

si je rajoute :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
tr:hover {
	background-color: black;
}

=> ça ne fonctionne pas : pas de changement de couleur lors du passage de la souris)

[Bisûnûrs]

Rajoute un DOCTYPE, sur Firefox et IE7 ça fonctionne très bien. En revanche sans DOCTYPE ça ne fonctionne pas sur IE7.