Créer un menu avec des boites animées grâce au CSS3

:salut:

Je vous propose une traduction de l'article anglophone Create An Animated CSS Box Menu par Paul Underwood : Créer un menu animé en CSS.

N'hésitez pas à faire part de vos remarques, commentaires ou propositions d'améliorations !

:fleche: Créer un menu animé en CSS.

:merci:

Très intéressant de retrouver ce classique (en tant que menu) sans Javascript bravo pour cette simplicité ;)

:ccool:

Le hr est caché derrière le menu.. comment l'éviter ?
Faut-il interrompre un héritage ? comment ?

Citation:

---

Envoyé par friendofweb

Le hr est caché derrière le menu.. comment l'éviter ?
Faut-il interrompre un héritage ? comment ?

---

réponse à ma question :

exemple de contenu :

Code:

---

1 2 3 4 5 6 7 8 9 10 11

<table width="100%" border="0" align="center" role="presentation" id="test"> <tbody> <tr> <td> <hr /> blabla blabla </td> </tr> </tbody> </table>

---

avec comme css :

Code:

---

1 2	#test { position: absolute ; top: 40%; left: 0px ;}

---

Si vous avez mieux, merci de me reprendre ;)

Pour ceux qui ne comprennent pas non plus, les indispensables :

Indispensable 1

Indispensable 2 (plusieurs styles à un élément)

Explications (classes) :

Question posée sur le forum css

Autre exemple intéressant :

Autre exemple

Merci pour le tuto !