Buenas,
he buscado por interne todas las posibilidades para centrar verticalmente una imagen dentro de un div.
Mi caso es que tengo un div con float: right con un ancho y alto especifico.
Dentro de este div va una imagen, que sus medidas son desconocidas, por lo que el ancho se ajusta y el alto nunca se supera. No llego a centrarlas verticalmente.
Adjunto el codigo:
Código HTML:
<div id="not">
<div id="d">
<h3>TITULO</h3>
<p>UNA DESCRIPCION</p>
</div>
<div id="imagen1">
<img id="i1" src="<?echo $ruta;?>">
</div>
<div id="f">
FECHA PUBLICACION
</div>
</div>
Aquí el CSS:
Código HTML:
#not{
width: 100%;
height: 49%;
margin-bottom: 1%;
}
#d{
width: 56%;
height: 80%;
float: left;
margin-right: 1%;
}
#d h3{
margin-top: 0%;
margin-bottom: 2%;
margin-left: 0%;
}
#d p{
width: 92%;
height: 75%;
margin-top: 0%;
margin-bottom: 0%;
margin-left: 8%;
}
#imagen1{
width: 43%;
height: 100%;
float: right;
}
#i1{
width: 100%;
height: auto;
}
Espero vuestra ayuda!
Muchas gracias de antemano.