Hola!
Necesito un poco de ayuda porque llevo toda la tarde pegándome cabezazos con esto.
Quiero hacer lo siguiente: Tengo imágenes de distinto tamaño, tanto en horizontal como en vertical y necesitaría que las horizontales, se me alinearan en el centro de la vertical. Para mostrarlas, quiero que se vayan mostrando en filas de 3 en 3, donde ni ancho ni alto de las filas sean fijos, ya que es para dispositivos móviles y pueden cambiar.
Tengo estos códigos:
HTML (impreso por php):
Código:
...
echo "<ul class='gallery'>";
foreach ($fotos as $key => $row) {
echo"<li><a href='".$row['url']."' rel='external'><img src='".$row['url']."' alt='Subida por ".$row['autor'].".' /></a></li>";
}
echo "</ul>";
...
y el CSS correspondiente:
Código:
.gallery { list-style: none; padding: 0; margin: 0; }
.gallery:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
.gallery li { float: left; width: 33.33333333%; }
.gallery li a { display: block; margin: 5px; border: 1px solid #3c3c3c; vertical-align:middle; }
.gallery li img { display: block; width: 100%; height: auto; vertical-align:middle; }
Alguien me echa una mano?? Gracias!!!