Foros del Web » Diseño web » CSS »

Centrar texto verticalmente dentro de un div

Estas en el tema de Centrar texto verticalmente dentro de un div en el foro de CSS en Foros del Web. Hola, tengo varios div de altura fija 50 px y quiero crear una clase para que cuando les ponga texto siempre quede centrado verticalmente, tanto ...
  #1 (permalink)  
Antiguo 02/02/2007, 19:36
 
Fecha de Ingreso: marzo-2005
Ubicación: Puerto Viejo - Costa Rica
Mensajes: 125
Antigüedad: 9 años, 7 meses
Puntos: 0
Centrar texto verticalmente dentro de un div

Hola, tengo varios div de altura fija 50 px y quiero crear una clase para que cuando les ponga texto siempre quede centrado verticalmente, tanto si es de una línea como de dos o tres, he intentado varias soluciones pero la verdad es que cada una es peor que la otra ¿alguien me puede dar una pista?
Muchas gracias
Guti
  #2 (permalink)  
Antiguo 02/02/2007, 22:47
Avatar de jorpcolombia  
Fecha de Ingreso: junio-2005
Ubicación: Bogotá
Mensajes: 105
Antigüedad: 9 años, 4 meses
Puntos: 0
Re: Centrar texto verticalmente dentro de un div

Código:
.miclase{text-align:center;}
eso centrará el texto dentro de todos los objetos con la clase ".miclase"
__________________
:pensando:¡No a lo inaccesible! ¡Sí a lo simple!:pensando
  #3 (permalink)  
Antiguo 02/02/2007, 23:31
 
Fecha de Ingreso: marzo-2005
Ubicación: Puerto Viejo - Costa Rica
Mensajes: 125
Antigüedad: 9 años, 7 meses
Puntos: 0
Re: Centrar texto verticalmente dentro de un div

Hola jorpcolombia, lo que yo necesito es centrar el texto verticalmente, o sea que quede el mismo espacio tanto por arriba como por abajo, text-align: center lo centra horizontalmente dejando el mismo espacio a la derecha y a la izquierda.
Guti
  #4 (permalink)  
Antiguo 02/02/2007, 23:43
Avatar de Gurrutello  
Fecha de Ingreso: enero-2002
Ubicación: Ontario,Toronto [Canada]
Mensajes: 2.017
Antigüedad: 12 años, 9 meses
Puntos: 6
Re: Centrar texto verticalmente dentro de un div

Hola
prueba
valign:middle;
o
valign:center;

aunque ahy otras manras com el padding margin etc...
en tu css
alguno de estos dos es
saludos
__________________
Un Saludo
www.tutores.org
Asp | Php | Javascript | Perl | Coldfusion | Flash | +- 2000 codigos
  #5 (permalink)  
Antiguo 02/02/2007, 23:53
 
Fecha de Ingreso: marzo-2005
Ubicación: Puerto Viejo - Costa Rica
Mensajes: 125
Antigüedad: 9 años, 7 meses
Puntos: 0
La solución

http://www.forosdelweb.com/showthrea...+verticalmente
  #6 (permalink)  
Antiguo 03/02/2007, 00:19
Avatar de B**
B**
 
Fecha de Ingreso: enero-2006
Ubicación: Monterrey,Mexico
Mensajes: 952
Antigüedad: 8 años, 9 meses
Puntos: 3
Re: Centrar texto verticalmente dentro de un div

Hola,
Creo que esta solucion es mas optima:
vertical-align
Mencionan el hack para que funcione en IE.
__________________
-URL= Go PHP5.
-Age=22.
-Learning=PHP,J2EE,Struts,MAMBO,C++,JSON,AJAX,XHTML ,CSS.
  #7 (permalink)  
Antiguo 09/04/2010, 11:33
 
Fecha de Ingreso: octubre-2009
Mensajes: 13
Antigüedad: 5 años
Puntos: 0
Respuesta: Centrar texto verticalmente dentro de un div

No, mira, la solución más facil si el texto es de una sola línea es que uses line-height:50px; o el tamaño que escogiste para la altura de tu div pero si es de varias lineas no se como hacerlo
  #8 (permalink)  
Antiguo 10/04/2010, 07:48
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.455
Antigüedad: 12 años, 4 meses
Puntos: 361
Respuesta: Re: Centrar texto verticalmente dentro de un div

Hola:

Cita:
Iniciado por jorpcolombia Ver Mensaje
Código:
.miclase{text-align:center;}
eso centrará el texto dentro de todos los objetos con la clase ".miclase"
Primero esto no centra, alinea (center, left, right, justify), además solo horizontalmente, con lo cual no sirve.

Segundo, como su propio nombre indica, afecta sólo a texto.

Saludos.

  #9 (permalink)  
Antiguo 24/07/2012, 14:58
 
Fecha de Ingreso: octubre-2009
Mensajes: 13
Antigüedad: 5 años
Puntos: 0
Respuesta: Centrar texto verticalmente dentro de un div

la única es que dentro del div metas una tabla y a esa tabla en el td le das esta propiedad

td
{
vertical-align:middle;
}

no se pueden centrar textos verticalmente en el div
  #10 (permalink)  
Antiguo 24/07/2012, 16:19
Avatar de TEPO  
Fecha de Ingreso: febrero-2010
Mensajes: 233
Antigüedad: 4 años, 8 meses
Puntos: 23
Respuesta: Centrar texto verticalmente dentro de un div

Lo mejor para mi es que metas un div que contenga el texto dentro del div grande y despues lo centras con margin-top negativo y margin-left negativo, en position absolute, lamentablemente no estoy en mi computadora y no te puedo mandar ejemplo, luego lo hago. Saludos.-
  #11 (permalink)  
Antiguo 24/07/2012, 18:29
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 1.974
Antigüedad: 5 años, 9 meses
Puntos: 299
Respuesta: Centrar texto verticalmente dentro de un div

Hola
Me parece que no se dieron cuenta del cartelito rojo que decía que este es un tema con más de 6 meses. Y si miran bien, el post inicial es de 2007.

Saludos
PD: a todos nos pasa, es más ya tenía listo este link:
http://ksesocss.blogspot.com/2012/05...6-maneras.html
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
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 04:21.
SEO by vBSEO 3.3.2