Como centrar una imagen verticalmente en un div

[isabelramirezmontoya]

Buenas noches

Tengo el siguiente inconveniente. Debo colocar una imagen dentro de un div. La imagen debe quedar centrada tanto vertical como horizontal, pero unicamente logro que quede centrada horizontalmente.

Nota: la imagen que va en div, la cambio cada semana y todas son de tamaño diferente.

El codigo que estoy utilizando es el siguiente:


img.img1
{
display: block;
margin: auto;
}


<div class="cuadro">

<img class="img1" src="imagen.jpg">

</div>

Mil gracias por su colaboracion

[vgonga1986]

No es nada sencillo lo que propones, sobre todo por la pega de que cambias la imagen y tiene tamaños diferentes. En CSS2 no se puede centrar verticalemente (si, es así de duro). Lo que hay es muchos trucos.

Si sabes el tamaño de la imagen lo más normal es centrarlo usando lo que se propone aquí. Otro truco es usar la propiedad vertical-align que tienen los img, cuyo cometido es centrar verticalemente el texto que rodea a una imagen, puedes ver la idea aquí.

Espero que alguno de los enlaces te sirva, creo que la solución por la que yo tiraría sería la primera, pero añadiría PHP para detectar el tamaño de la imagen y ajustar los valores.

Un saludo.