Foros del Web » Creando para Internet » CSS »

centrar verticalmente

Estas en el tema de centrar verticalmente en el foro de CSS en Foros del Web. Buenas!! Lo del centrado vertical me mata.. SIEEEMPRE!! En el siguiente caso, ¿como hariais para centrar verticalmente el id "principal" sea cual sea el ancho ...
  #1 (permalink)  
Antiguo 01/03/2014, 07:33
 
Fecha de Ingreso: julio-2010
Ubicación: A Coruña
Mensajes: 505
Antigüedad: 13 años, 8 meses
Puntos: 60
centrar verticalmente

Buenas!!

Lo del centrado vertical me mata.. SIEEEMPRE!!

En el siguiente caso, ¿como hariais para centrar verticalmente el id "principal" sea cual sea el ancho de la pantalla?

http://codepen.io/zeromm/pen/duyGj
__________________
http://zeromm.es/
Diseñador Web | Experto en Responsive Design, CSS3 y Optimización Web.
  #2 (permalink)  
Antiguo 01/03/2014, 10:08
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: centrar verticalmente

Supongo que te refieres al alto.

Yo haría algo tal que:

Código CSS:
Ver original
  1. div#principal {
  2.   position: relative;
  3.   top: 50%;
  4.   transform: translateY(-50%);
  5. }

Dado que translate(X|Y) toma como referencia al propio elemento siempre se centrará. Obviamente html y body necesitarán tener una altura.
  #3 (permalink)  
Antiguo 02/03/2014, 13:00
 
Fecha de Ingreso: julio-2010
Ubicación: A Coruña
Mensajes: 505
Antigüedad: 13 años, 8 meses
Puntos: 60
Respuesta: centrar verticalmente

Anda, mira tú, este sistema no lo conocía :)

Graaacias ;)
__________________
http://zeromm.es/
Diseñador Web | Experto en Responsive Design, CSS3 y Optimización Web.

Etiquetas: verticalmente
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 18:46.