Bouton changeant en css

Bonjour,

Je cherche à faire des boutons sympa en CSS pour des :

Code:

---

<input type="button" name="Retour" onclick='envoi(this, this.form.id);' value="Retour" class="button">

---

J'ai donc fait :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

.button { background: #ffffcc url("../images/fond_menu_off.gif") repeat-x; font-weight: bold; /*** Pour améliorer la lisibilité des titres ***/ color: #333300; height: 20px; text-align:center; border-top: 1px solid #cccc99; border-right: 1px solid #cccc99; border-bottom: 1px solid #cccc99; border-left: 1px solid #cccc99; padding:5px 15px 20px 15px; }

---

Je veux ajouter un effet lorsque l'on passe dessus, je sais que c'est possible, mais je n'y arrive pas, j'ai mis :

Code:

---

1 2 3 4

.button hover { background: #333300 url("../images/fond_menu_on.gif") repeat-x top left; color: #ffffcc; }

---

Ben ça ne fonctionne pas, manque un truc, mais je ne vois pas

Merci d'avance

un : ?

Code:

---

1 2 3 4

.button:hover { background: #333300 url("../images/fond_menu_on.gif") repeat-x top left; color: #ffffcc; }

---

peut être avec

input.button:hover{...

Citation:

---

Envoyé par Dan_A

peut être avec

input.button:hover{...

---

Exa, c'est exact, impeccable.

Merci beaucoup