28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

je galère avec un CSS, j'ai actuellement :
http://img80.imageshack.us/img80/3166/plat1kn5.gif

et on over, cela donne actuellement :
http://img248.imageshack.us/img248/4048/plat2ya6.gif

j'aimerais aligner mon texte au centre du block
HTML:
<ul id="plateforme">
<li><a href="show.php?gam_id=2&amp;plf_id=13"><img src="/images/plateform/13.gif">PC</a></li>
<li><a href="show_game.php?gam_id=3&amp;plf_id=22"><img src="/images/plateform/22.gif">Mac</a></li>
</ul>


CSS :
#plateforme { list-style-type:none; margin:0; padding:0;}
#plateforme li{ display:inline; float:left; margin-right:2px;
	background: url(../images/plateform/fd_plat_off.gif) left top no-repeat;}
#plateforme li:hover{ background: url(../images/plateform/fd_plat_on.gif) left top no-repeat;}
#plateforme li a{
	display:block;
	width:61px; height:28px; margin-bottom:10px;}

#plateforme img { border:#558abe 1px solid;}
#plateforme img:hover { border:#f3cc18 1px solid;}


j'ai essayé les padding et margin dans le a et dans le li, mais rien n'y fait. Y a t-il une solution ?
Modifié par Joe Le Mort (08 Apr 2008 - 09:58)
Hello Smiley smile

Tu peux essayer ça :
#plateforme li{ 
[...]
height:...px,
line-height:...px;}

height et line-height doivent avoir la même valeur (dans ton cas la hauteur de ton image + les 2px des bordures de tes images).
Modifié par BeliG (08 Apr 2008 - 10:39)
Florent V. a écrit :
Bonjour,

Un vertical-align: middle sur l'image, peut-être?

Merci Florent,
Je n'aurais jamais pensé qu'en alignant l'image, le texte aurait pu être aligné.
en tout cas, merci Smiley biggrin