Foros del Web » Creando para Internet » CSS »

Centrar imagen con overflow hidden dentro de un link

Estas en el tema de Centrar imagen con overflow hidden dentro de un link en el foro de CSS en Foros del Web. Hola amigos, tengo un pequeño problema y necesitaria de su ayuda; Tengo unas imagenes de diferentes dimensiones, siempre de tamaños chicos, como por ejemplo; 50px ...
  #1 (permalink)  
Antiguo 06/01/2009, 06:58
 
Fecha de Ingreso: noviembre-2007
Mensajes: 38
Antigüedad: 10 años
Puntos: 2
Centrar imagen con overflow hidden dentro de un link

Hola amigos, tengo un pequeño problema y necesitaria de su ayuda;

Tengo unas imagenes de diferentes dimensiones, siempre de tamaños chicos, como por ejemplo; 50px por 80 px, 100px por 70 px, etc, siempre son imagenes pequeñas.
Lo que quiero hacer es meterlas dentro de un recudro, agrandarlas, centrarlas en este recuadro de 83px por 83px y esconder lo que sobra de la imagen.

Hasta ahora pude lograr algo de ello, pero no logro centrar las imagenes, les adjunto el codigo;

Código HTML:
<html><head>
<style type="text/css">
.thumbnails {style.css (línea 76)
background:#FFFFFF url(../images/thumbnail_bg.gif) no-repeat scroll center top;
float:left;
height:93px;
margin-bottom:6px;
margin-right:6px;
width:96px;
}
</style></head><body>
<div class="thumbnails">
  <a href="http://google.com" style="margin: auto; overflow: hidden; width: 83px; height: 83px; display: block; text-align: center;">
<img style="display: block; overflow-x: visible; overflow-y: auto; text-align: center; margin-right: auto; margin-left: auto;width: 200%;height:200%" alt="La googlemania" src="http://profile.ak.facebook.com/object2/1899/65/q10772521738_5148.jpg"/>
</a>
</div>
</body>
</html> 

Como veran si prueban el ejemplo notaran que la imagen no esta centrada.
Alguno tiene alguna sugerencia?

Saludos
  #2 (permalink)  
Antiguo 06/01/2009, 16:38
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Centrar imagen con overflow hidden dentro de un link

¿Centrar vertical u horizontalmente?
__________________
Visita mi nueva web idplus.org
  #3 (permalink)  
Antiguo 06/01/2009, 17:45
 
Fecha de Ingreso: noviembre-2007
Mensajes: 38
Antigüedad: 10 años
Puntos: 2
Respuesta: Centrar imagen con overflow hidden dentro de un link

Hola, quiero centrar de ambas formas, vertical y horizontalmente, actualmente la imagen se ve de esta forma;

Donde X es la imagen que se ve y * esta escondido por la propiedad overflow:hidden;

XXXX****
XXXX****
XXXX****
********
********

Y yo quiero que la imagen quede asi;

********
**XXXX**
**XXXX**
**XXXX**
********


Saludos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 09:55.