Foros del Web » Creando para Internet » CSS »

centrar el contenido de un div

Estas en el tema de centrar el contenido de un div en el foro de CSS en Foros del Web. Buenas: he buscado la manera de centrar el contenido en un div he buscado mucho por internet, he provado desde css (vertical aling) hasta javascript ...
  #1 (permalink)  
Antiguo 05/03/2009, 12:33
 
Fecha de Ingreso: noviembre-2007
Mensajes: 229
Antigüedad: 16 años, 4 meses
Puntos: 0
centrar el contenido de un div

Buenas: he buscado la manera de centrar el contenido en un div he buscado mucho por internet, he provado desde css (vertical aling) hasta javascript pero no funciona...

alguien me puede ayudar?

mercii
  #2 (permalink)  
Antiguo 05/03/2009, 12:48
Avatar de foreverOdd  
Fecha de Ingreso: noviembre-2007
Ubicación: Caracas
Mensajes: 489
Antigüedad: 16 años, 4 meses
Puntos: 14
Respuesta: centrar el contenido de un div

Intentalo con esto:

Código css:
Ver original
  1. display:table-cell;
  2. vertical-align:middle;

Suerte
__________________
My path is lit by my own fire, I only go where I desire
  #3 (permalink)  
Antiguo 05/03/2009, 16:48
 
Fecha de Ingreso: noviembre-2007
Mensajes: 229
Antigüedad: 16 años, 4 meses
Puntos: 0
Respuesta: centrar el contenido de un div

funciona solo con texto no con las imagenes...

joer me trae de cabeza esto...


merci de todas formas
  #4 (permalink)  
Antiguo 05/03/2009, 18:20
 
Fecha de Ingreso: marzo-2008
Mensajes: 1.020
Antigüedad: 16 años, 1 mes
Puntos: 21
Respuesta: centrar el contenido de un div

Para mi tendrias q poner un contenedor y dentro de este otro div con la imagen:

añgo asi:

<div id="contenedor">

<div id="img"> <img src="img/imagen.png"></div>

</div>

CSS:

#contenedor{
text-align:center;
}
y si hay texto en ese div donde esta la imagen, y a ese texto no lo queres centrado al igual que la imagen, haces esto:

<div id="contenedor">

<div id="img"> <img src="img/imagen.png">

<p>Texto a la izquierda con la imagen centrada por el contenedor</p>

</div>

</div>

CSS:

#contenedor{
text-align:center;
}

#imagen p{
text-align:left;
}

Espero haber dado en la tecla. saludos.

Última edición por opzina; 05/03/2009 a las 18:29
  #5 (permalink)  
Antiguo 09/03/2009, 07:54
Avatar de foreverOdd  
Fecha de Ingreso: noviembre-2007
Ubicación: Caracas
Mensajes: 489
Antigüedad: 16 años, 4 meses
Puntos: 14
Respuesta: centrar el contenido de un div

entonces es mas facil si es con una imagen solo haz esto:

#imagen{margin:auto;}

<img id="imagen" src="path" />

Con esto centras la imagen horizontalmente y verticalmente.
__________________
My path is lit by my own fire, I only go where I desire
  #6 (permalink)  
Antiguo 09/03/2009, 08:13
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Respuesta: centrar el contenido de un div

Cita:
Iniciado por foreverOdd Ver Mensaje
entonces es mas facil si es con una imagen solo haz esto:
#imagen{margin:auto;}
<img id="imagen" src="path" />
Con esto centras la imagen horizontalmente y verticalmente.
¿Lo has probado? ¿podrías subir un ejemplo en el que se vea?
__________________
Visita mi nueva web idplus.org
  #7 (permalink)  
Antiguo 09/03/2009, 08:31
Avatar de foreverOdd  
Fecha de Ingreso: noviembre-2007
Ubicación: Caracas
Mensajes: 489
Antigüedad: 16 años, 4 meses
Puntos: 14
Respuesta: centrar el contenido de un div

Si ya lo probe, y no funciona

Pensen que se podia aplicar el mismo criterio q para otros elementos.
__________________
My path is lit by my own fire, I only go where I desire
  #8 (permalink)  
Antiguo 09/03/2009, 16:52
 
Fecha de Ingreso: marzo-2008
Mensajes: 1.020
Antigüedad: 16 años, 1 mes
Puntos: 21
Respuesta: centrar el contenido de un div

a ver si te ssirve esto: click aqui.

SAludos
  #9 (permalink)  
Antiguo 14/09/2012, 10:26
Avatar de hormix  
Fecha de Ingreso: diciembre-2011
Ubicación: Santiago
Mensajes: 39
Antigüedad: 12 años, 4 meses
Puntos: 1
De acuerdo Respuesta: centrar el contenido de un div

Cita:
Iniciado por foreverOdd Ver Mensaje
Intentalo con esto:

Código css:
Ver original
  1. display:table-cell;
  2. vertical-align:middle;

Suerte
Gracias con esto me sirvio!
__________________
Nunca digas nunca, mira siempre adelante, no vivas en el pasado, cree en un dios, no odies por que seras odiado, no comas carne y respeta a los demás.
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 13:07.