Ho cercato altre domande e, mentre questo problema sembra simile a un paio di altri, nulla di ciò che ho visto finora sembra affrontare il problema che sto riscontrando.
Ho un div che contiene un numero di altri div, ognuno dei quali è flottato a sinistra. Queste div contengono ciascuna una foto e una didascalia. Tutto quello che voglio è che il gruppo di foto sia centrato all'interno del div contenente.
Come si può vedere dal codice qui sotto, ho provato utilizzando sia overflow:hidden
e margin:x auto
dei div genitore, e ho anche aggiunto una clear:both
(come suggerito in un altro argomento), dopo le foto. Nulla sembra fare la differenza.
Grazie. Apprezzo qualsiasi suggerimento.
<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>