28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'aimerais connaitre une astuce pour center verticalement le texte d'une balise div afin de créer une petite info bulle lors de l'envoi un formulaire.

http://img4.hostingpics.net/pics/879002Capture.jpg

.infobulle_valid{ 
margin: auto; 
width:350px; 
height:75px; 
border: 1px #000 solid; 
background:url(images/validate.png) center left no-repeat #9C9; 
background-position:15px; 
padding-left: 80px; 
-webkit-border-radius: 10px; 
-moz-border-radius: 10px; 
border-radius: 10px; 
font:normal 14px Arial, Helvetica, sans-serif; color:#444;
}


Donc voila, comme on voit sur l'image, le texte est collé au top. J'aimerais qu'il soit verticalement centré comme l'image utilisé dans le background pour faire une infobulle propre...

J'ai essayé de mettre un
padding-top: 30px;
mais la div s'agrandit au fur et à mesure.. le milieu bouge également... Mon but est de faire quand même un truc assez discret, pas envie que ca prenne toute ma page juste pour un centrage.. Smiley bawling
http://img4.hostingpics.net/pics/938500Capture.jpg

Une solution miracle?

Merci d'avance!
Modifié par Apooo (14 Apr 2011 - 16:49)
Bon bha, c'est quand on demande de l'aide que l'on trouve par soi-même alors qu'on a chercher pendant je sais pas combien de temps avant sans résultat... D'une simplicité trop simpliste peut être?

Il fallait juste penser à diminuer le height en conséquence du padding-top.

Merci quand même Smiley smile
Modifié par Apooo (14 Apr 2011 - 16:46)
moi, je préfère utiliser line-height pour centrer verticalement le texte, car des fois sous Windows tout est normal avec padding-top , mais sur linux ou mac, le texte n'est plus centré.