J'ai cherché d'autres questions et, bien que ce problème semble similaire à quelques autres, rien de ce que j'ai vu jusqu'à présent ne semble résoudre le problème que je rencontre.
J'ai un div qui contient un certain nombre d'autres div, dont chacun est flottant à gauche. Ces divs contiennent chacun une photo et une légende. Tout ce que je veux, c'est que le groupe de photos soit centré dans le div contenant.
Comme vous pouvez le voir dans le code ci-dessous, j'ai essayé d'utiliser à la fois overflow:hidden
et margin:x auto
sur les div parent, et j'ai également ajouté un clear:both
(comme suggéré dans un autre sujet) après les photos. Rien ne semble faire de différence.
Je vous remercie. J'apprécie toutes les suggestions.
<div style="position: relative; margin: 0 auto; overflow: hidden; text-align: center;">
<h4>Section Header</h4>
<div style="margin: 2em auto;">
<div style="float: left; margin: auto 1.5em;">
<img src="photo1.jpg" /><br />
Photo Caption
</div>
<div style="float: left; margin: auto 1.5em;">
<img src="photo2.jpg" /><br />
Photo Caption
</div>
<div style="float: left; margin: auto 1.5em;">
<img src="photo3.jpg" /><br />
Photo Caption
</div>
<div style="clear: both; height: 0; overflow: hidden;"> </div>
</div>
</div>