Centrer plusieurs images avec marge
Bonjour à tous,
C'est le premier message que je poste ici, si problème il y a avec celui ci, n'hésitez pas à m'en faire part.
Ce que je voudrais faire? je vais montrer un exemple:
http://www.hardware.fr/html/news/cat3/page2.html
C'est le deuxième article intitulé : CeBIT : Intel P35, G33 et 45nm qui nous intéresse.
Les cartes mères sont centrées au milieu, avec une marge entre elles.
Pour les centrer j'ai utilisé le css text-align: center.
J'ai mis les 2 image dans le même bloque, c'est une erreur puisque lorsque je met les bordures , elle ne sont pas entourées individuellement mais en une seule et même image.
En mettant dans 2 bloques différents et en utilisant margin-left right ect.. les marge n'apparaissent pas.
Voici le code html:
Code:
1
2
3
4
| <div class="image_centre">
<img src="http://m4ximuz.free.fr/images/v-4835.jpg" alt="cart1" /></div>
<div class="image_centre">
<img src="http://m4ximuz.free.fr/images/v-8129.jpg" alt="cart2" /></div><br /> |
et le css:
Code:
1
2
3
4
5
6
7
8
9
10
| .image_centre
{
text-align: center;
margin-left:10px;
margin-bottom:10px;
border:#FF6600 solid 1px;
margin-right:10px;
} |
donc qu'elle est la meilleurs méthode pour centrer 2, 4 ou même plus d'images et d'avoir une marge entre elles ainsi que des bordures?
La question ne semble vraiment pas compliquée, mais cela fait déjà un petit moment que je m'arrache les cheveux dessus..
Merci d'avance pour vos réponses
