table-cell se comporta como una celda de una tabla,
y ahi esta justamente el error, no es la imagen la que debe llevar las
propiedades que le estas dando,
seria algo como:
#ofertas div.imagen div {
display: table-cell;
vertical-align: middle;
position: relative;
}
<div class="imagen">
<div><img src="img/1img_viajes.gif" alt="xxxxx" /></div>
</div>
saludos
> El 24 de marzo de 2011 14:19, Montserrat Vázquez Hernando
> <[email protected]>escribió:
>
> > Buenas tardes,
> >
> > acudo hoy a vosotros con un problema que apriori puede parecer trivial
> > pero os aseguro que no lo es. Tengo un div, del que conozco las
> > dimensiones y dentro debo pintar una imagen, centrada horizontal y
> > verticalmente, sin saber el tamaño que puede tener, por lo que no puedo
> > jugar con margins y paddings ... he conseguido que funcione utilizando
> > "display:table" y "display: table-cell" pero curiosamente SOLO funciona
> > en IE 8, y no el el resto (IE 7, Firefox y Chrome), para el resto,
> > cuando la imagen es más pequeña, se pega al top/left.
> >
> > Os paso extracto de la página:
> >
> > #ofertas{margin:5px 0 0 280px; width:675px; min-height: 170px;}
> > #ofertas p{ margin:5px 0}
> > #ofertas.oferton h4{font:bold 14px Helvetica, Arial,
> > sans-serif;color:#666;margin-bottom:10px; color:#EC1C24}
> >
> >
> > #ofertas div.imagen{
> > border:solid 2px #dadada;
> > padding:5px;
> > width:144px;
> > height:144px;
> > float:left;
> > margin-right:10px;
> > display: table;
> > }
> >
> > #ofertas div.imagen img {
> > display: table-cell;
> > vertical-align: middle;
> > position: relative;
> > }
> >
> >
> >
> > <div id="ofertas" class="oferton">
> > <div class="imagen">
> > <img src="img/1img_viajes.gif" alt="xxxxx" />
> > </div>
> > <h4>Aqui el título de la oferta</h4>
> > <p>Aquí la descripción de la oferta. Aquí la descripción de la oferta.
> > Aquí la descripción de la oferta.Aquí la descripción de la oferta.
> > Aquí la descripción de la oferta.<a href="" class="resaltado">Más info
> > ...</a></p>
> > </div>
> >
> > ¿Se os ocurre como hacerlo para que funcione en todos los navegadores?
> >
> > --
> >
> > Montserrat Vázquez Hernando
> >
> > [email protected]
> >
> > _______________________________________________
> > Lista de distribución Ovillo
> > Para escribir a la lista, envia un correo a [email protected]
> > Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> > http://lists.ovillo.org/mailman/listinfo/ovillo
> >
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a [email protected]
> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> http://lists.ovillo.org/mailman/listinfo/ovillo
>
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
