Salve, sto avendo problemi ad affiancare tre immagini, ciascuna con una propria forma e dimensione, in tre div destinati a contenerne una ciascuna.
Lo scopo è simulare la pubblicazione di immagini in maniera ordinata indipendentemente dalle dimensioni delle immagini, opportunamente scalate in css...
Questo è il codice css...
Questo invece è l'html (file in html5)...codice:div.foto { float: left; text-align: center; vertical-align: middle; height: 200px; width: 200px; margin: 10px; } img.prodotto { width: auto; height: auto; max-width: 200px; max-height: 200px; margin: auto; }
I div sono tre quadrati 200x200 che devono contenere le tre immagini in dimensioni reali se più piccole di 200x200, scalate a massimo 200x200 in caso contrario.codice:<div class="foto"><img src="scanner.jpg" class="prodotto" /></div> <div class="foto"><img src="stampante.jpg" class="prodotto" /></div> <div class="foto"><img src="yatta-small.jpg" class="prodotto" /></div>
Funziona, tranne per il centramento delle immagini nei div.