Problème avec un h2 et hover
Bonjour tout le monde ^^
Voici mon problème :
j'ai un tableau, qui est mon menu, où chaque cellule contient le nom d'une catégorie. Ces noms sont des liens, et sont en même temps des titres h2.
Bref, un truc de ce genre :
Code:
1
2
3
4
5
6
7
|
<table>
<tr>
<td class=menu_td><h2>Titre 1</h2></td>
<td class=menu_td><h2>Titre 2</h2></td>
</tr>
</table> |
Imaginons que là, c'est en fond blanc écriture noire.
Je voudrais que lorsque l'on passe la souris la cellule, cela devienne fond noir écriture blanche. Là ça me paraissait simple :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
h2{
color:#000000;
}
h2:hover{
color:#ffffff;
}
.menu_td{
background-color:#ffffff;
}
.menu_td:hover{
background-color:#000000;
} |
Le problème, c'est que cela fonctionne lorsque l'on passe la souris sur le titre (h2), vu qu'on passe en même temps sur la cellule.
Mais lorsque l'on passe la souris dans un endroit de la cellule, sans toucher le titre (h2), et bien le fond change mais pas la couleur du h2.
Définir un "color:#000000" dans menu_td ou le menu_td:hover ne change rien, la défition du h2 prenant le dessus apparement.
Bref, j'espère avoir été clair ^^
Par exemple, je me demandais s'il existait un truc de ce genre :
Code:
1
2
3
| .menu_td:hover h2{
background-color:#000000;
} |
