HTML Centrer 3 images
Résolu
Bonjour,
j'ai commencé un site;
j'avais envie de faire un menu horizontal...et pour ca, j'ai mis le fond grace a une image en background et repeat.
Par contre, dans mon html, je centre les images qui sont au nombre de 3 et qui servent à faire les boutons...mais le problème c'est qu'elles se superposent...comment faire pour qu'elles soient centrées sans se superposer ?
CSS
.top_menu{
background-image: url(images/top_menu.jpg);
background-repeat:repeat-x;
height: 40px;
}
img{
display: block;
margin: auto;
position:relative;
}
HTML
<div class="top_menu">
<img alt="bouton" src="images/bouton1.png"/>
<img alt="bouton" src="images/bouton2.png"/>
<img alt="bouton" src="images/bouton3.png"/>
</div>
Mes solutions
j'ai pensé à faire 3 div différents mais ca va faire gros, j'ai aussi pensé à un table mais ca va faire des lignes et j'aime pas...
ps: je sais que j'ai pas encore mis le lien à mes boutons
Avez-vous une solution svp ? Merci
j'ai commencé un site;
j'avais envie de faire un menu horizontal...et pour ca, j'ai mis le fond grace a une image en background et repeat.
Par contre, dans mon html, je centre les images qui sont au nombre de 3 et qui servent à faire les boutons...mais le problème c'est qu'elles se superposent...comment faire pour qu'elles soient centrées sans se superposer ?
CSS
.top_menu{
background-image: url(images/top_menu.jpg);
background-repeat:repeat-x;
height: 40px;
}
img{
display: block;
margin: auto;
position:relative;
}
HTML
<div class="top_menu">
<img alt="bouton" src="images/bouton1.png"/>
<img alt="bouton" src="images/bouton2.png"/>
<img alt="bouton" src="images/bouton3.png"/>
</div>
Mes solutions
j'ai pensé à faire 3 div différents mais ca va faire gros, j'ai aussi pensé à un table mais ca va faire des lignes et j'aime pas...
ps: je sais que j'ai pas encore mis le lien à mes boutons
Avez-vous une solution svp ? Merci
Configuration: Windows Vista Firefox 3.0.3
3 réponses
-
il suffit de faire un text-align dans ...dans mon cas .top_menu et on peut tout effacer de img dans le css
merci lrt88 de m'avoir aidé -
T'inquiètes pas mon text align a marché, j'avais essayé ce que tu me proposes mais ca se superposait aussi...surement à cause de display block
MERCI quand même -
essaie ça
<div class="top_menu">
<img alt="bouton" src="images/bouton1.png"/ align="center">
<img alt="bouton" src="images/bouton2.png"/ align="center">
<img alt="bouton" src="images/bouton3.png"/ align="center">
</div>
