Effet de slide et transition sur les titres qui fait descendre le forum

[Invité]

Détails techniques

Version du forum : PunBB
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://www.diamant-mandarin-evo.com/

Description du problème

Bonsoir,

J'ai appliqué un code pour un slide et transition de couleur sur les titres.

Seulement lorsque que l'effet s’applique en passant la souris sur un titre cela fait légèrement descendre le reste du forum. Vous pouvez tester sur mon forum.

Voici le CSS:

Code:

.forumtitle { -webkit-transition: all 0.6s ease-in; -moz-transition: all 0.6s ease-in;
 -o-transition: all 0.6s ease-in; transition: all 0.6s ease-in; }
a.forumtitle:hover { color: green;margin-left: 12px; }
.topictitle { -webkit-transition: all 0.6s ease-in; -moz-transition: all 0.6s ease-in;
 -o-transition: all 0.6s ease-in; transition: all 0.6s ease-in; }
a.topictitle:hover { color: green;margin-left: 12px; }


Comment éviter cette effet non désiré? merci de votre aide.

[Invité]

Up

[Teurancher]

Salut à toi,
Premier essai;

Code:

.forumtitle {
-webkit-transition: all 0.6s ease-in;
-moz-transition: all 0.6s ease-in;
-o-transition: all 0.6s ease-in;
transition: all 0.6s ease-in;
display: inline-block; }

[Invité]

Salut Teurancher,

J'ai ajouté

Code:

display: inline-block;

, Pas de changement, as-tu une autre idée?

Merci

[Teurancher]

Re,
Second essai, n'oublie pas de retirer les autres code CSS pour pas avoir un mélange des deux codes ~

Code:

.forumtitle {
-webkit-transition: all 0.6s ease-in;
-moz-transition: all 0.6s ease-in;
-o-transition: all 0.6s ease-in;
transition: all 0.6s ease-in;
display: inline-block; }

a.forumtitle:hover {
color: green;
margin-left: 12px;
display: inline-block; }

.topictitle {
-webkit-transition: all 0.6s ease-in;
-moz-transition: all 0.6s ease-in;
-o-transition: all 0.6s ease-in;
transition: all 0.6s ease-in;
display: inline-block; }

a.topictitle:hover { display: inline-block;  color: green;margin-left: 12px; }

Cela fonctionne pour ma part. ^^

[Invité]

Oui!! Ca fonctionne aussi for me

Thanks!