Foros del Web » Creando para Internet » CSS »

Problema con centrado vertical de bloques (div)

Estas en el tema de Problema con centrado vertical de bloques (div) en el foro de CSS en Foros del Web. Hola: A ver si alguien me puede echar un cable. Estoy desarrollando una herramienta de publicación de galerías de fotos y deseo que los enlaces ...
  #1 (permalink)  
Antiguo 20/02/2009, 18:14
 
Fecha de Ingreso: febrero-2009
Mensajes: 2
Antigüedad: 8 años, 9 meses
Puntos: 0
Problema con centrado vertical de bloques (div)

Hola:

A ver si alguien me puede echar un cable. Estoy desarrollando una herramienta de publicación de galerías de fotos y deseo que los enlaces a cada foto sea una imagen reducida que se muestre centrada horizontal y verticalmente en su contenedor, un DIV. El centrado horizontal es facil, pero con el vertical no veo la forma. Pongo la dirección de una demo de una galería con los elementos centrados en horizontal pero no en vertical.

Como el sistema no me deja poner la url (es mi primer mensaje) lo "oculto un poco". Espero no se castigado por ello y que se entienda. Disculpas si comento alguna incoreccion.

inakiperez(punto)260mb(punto)com

¿Alguna ayuda o sugerencia?

!!Muchas gracias por adelantado!!
  #2 (permalink)  
Antiguo 20/02/2009, 18:24
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Problema con centrado vertical de bloques (div)

Hola.

¿Has probado con vertical-align: middle;?.

Saludos.

  #3 (permalink)  
Antiguo 20/02/2009, 20:45
Avatar de Dalvenjha  
Fecha de Ingreso: febrero-2008
Ubicación: $("#oficina");
Mensajes: 692
Antigüedad: 9 años, 9 meses
Puntos: 53
Respuesta: Problema con centrado vertical de bloques (div)

Eso es CSS3 y no funciona en todos los navegadores, ojalá que lo implemente ya!! nos ahorraría mucho a todos.

Saludos!!
__________________
Mi Showcase ||

Compartiendo todo lo posible con los demás.
  #4 (permalink)  
Antiguo 20/02/2009, 22:00
 
Fecha de Ingreso: febrero-2009
Mensajes: 7
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con centrado vertical de bloques (div)

Y SI PRUEBAS CON MARGIN : auto o ala caja principal relative y al elemento q deseas centrar darle absolute position y meterle top y left 50% 50% o no se _
  #5 (permalink)  
Antiguo 21/02/2009, 03:12
 
Fecha de Ingreso: noviembre-2008
Mensajes: 94
Antigüedad: 9 años
Puntos: 6
Respuesta: Problema con centrado vertical de bloques (div)

La técnica del margen al 50% la puedes ver en http://robertobaca.net/ejemplos/centradovertical.htm (checa el código)

Es un hack, pero es la solución más sencilla usando css. Para cosas más complicadas tal vez necesitarás usar javascript.
  #6 (permalink)  
Antiguo 21/02/2009, 11:13
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: Problema con centrado vertical de bloques (div)

El vertical-align: middle no es que sea CSS3, sino que depende del posicionamiento con display table y display table-cell, que es lo que realmente no entienden todos los navegadores (como de normal, lo entienden todos menos IE6).

Si tus miniaturas tienen un tamaño fijo puedes usar la técnica que te propone rb3m.
Si no es así, mira aquí: en la columna izquerda encontrarás tres técnicas para el centrado vertical que son compatibles con IE6.
__________________
Visita mi nueva web idplus.org
  #7 (permalink)  
Antiguo 02/03/2009, 07:46
 
Fecha de Ingreso: febrero-2009
Mensajes: 2
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con centrado vertical de bloques (div)

Finalmente resuelto el problema añadiendo un contenedor para el centrado (class='centrado') y con un pequeño hack para solventar la incompatibilidad entre navegadores.

La solución la muestro en la página siguiente(sustituir "(punto)" por "."):

inakiperez(punto)260mb(punto)com

El css está en el propio código de la página.

¡Muchas gracias a todos por vuestras respuestas y por dedicarme vuestro tiempo!
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 11:06.