Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Centrar divs con contenedor 100% ancho

Estas en el tema de Centrar divs con contenedor 100% ancho en el foro de CSS en Foros del Web. Hola, me estoy volviendo loco para poder solucionar este problema, calculo que debe ser muy comun. Tengo un div 100% de ancho el cual contiene ...
  #1 (permalink)  
Antiguo 03/11/2013, 04:41
 
Fecha de Ingreso: noviembre-2009
Mensajes: 41
Antigüedad: 14 años, 7 meses
Puntos: 0
Pregunta Centrar divs con contenedor 100% ancho

Hola, me estoy volviendo loco para poder solucionar este problema, calculo que debe ser muy comun. Tengo un div 100% de ancho el cual contiene 6 divs con ancho fijo 400px. Lo que quiero es que los 6 divs se centren solos para todas las resoluciones, aca muestro unas imagenes:

Tengo esto:


Y quiero que quede asi:


En otro caso con otra resolucion menor podria tener esto:


Y quiero que quede asi:




El "margin: 0 auto" no me sirve porque para eso deberia tener fijado el ancho del contenedor en px y en este caso es el 100%.

Llevo muuuucho tiempo queriendo solucionar esto y no puedo, espero que puedan ayudarme!

Desde ya muchas gracias!!
  #2 (permalink)  
Antiguo 03/11/2013, 05:28
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años, 3 meses
Puntos: 1826
Respuesta: Centrar divs con contenedor 100% ancho

Yo probaría dejar los elementos no como supongo lo tienes block y float, sino como display: inline-block y dejar en el contenedor, un text-align: center.
  #3 (permalink)  
Antiguo 03/11/2013, 05:38
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 4 meses
Puntos: 306
Respuesta: Centrar divs con contenedor 100% ancho

Supongo que tus div de anchos fijos están flotados, ya que el margin:0 auto debería funcionar si no estuvieran flotados o posicionado en forma absoluta.

Como recomendación primera: El código vale más que mil imágenes, así que acostumbrate a mostrar el código que estas usando para lograr lo que pretendes. Así la ayuda será mucho más puntual que la ayuda general que te doy a continuación:

Ayuda: http://ksesocss.blogspot.com/2012/05...6-maneras.html

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #4 (permalink)  
Antiguo 03/11/2013, 12:43
 
Fecha de Ingreso: noviembre-2009
Mensajes: 41
Antigüedad: 14 años, 7 meses
Puntos: 0
Respuesta: Centrar divs con contenedor 100% ancho

Cita:
Iniciado por C2am Ver Mensaje
Supongo que tus div de anchos fijos están flotados, ya que el margin:0 auto debería funcionar si no estuvieran flotados o posicionado en forma absoluta.

Como recomendación primera: El código vale más que mil imágenes, así que acostumbrate a mostrar el código que estas usando para lograr lo que pretendes. Así la ayuda será mucho más puntual que la ayuda general que te doy a continuación:

Ayuda: http://ksesocss.blogspot.com/2012/05...6-maneras.html

Saludos
Perdon!!
El codigo que uso es el siguiente:

<div id="contenedor">
<div style="float: left; width: 400px; height: 250px;"></div>
<div style="float: left; width: 400px; height: 250px;"></div>
<div style="float: left; width: 400px; height: 250px;"></div>
<div style="float: left; width: 400px; height: 250px;"></div>
<div style="float: left; width: 400px; height: 250px;"></div>
<div style="float: left; width: 400px; height: 250px;"></div>
</div>



si al #contenedor le pongo margin: 0 auto no hace nada ya que para eso deberia de especificarle el ancho, y el ancho es el ancho del navegador, es decir el 100%.
Otra cosa que se le podria hacer es ponerle position absolute, left 50% y margin left -(la mitad del ancho div contenedor) pero como no tengo el ancho del #contenedor tampoco me sirve.
  #5 (permalink)  
Antiguo 03/11/2013, 12:48
 
Fecha de Ingreso: noviembre-2009
Mensajes: 41
Antigüedad: 14 años, 7 meses
Puntos: 0
Respuesta: Centrar divs con contenedor 100% ancho

Cita:
Iniciado por Rafael Ver Mensaje
Yo probaría dejar los elementos no como supongo lo tienes block y float, sino como display: inline-block y dejar en el contenedor, un text-align: center.
Siiiiiiii, solucionado! muchisimas gracias!!

Etiquetas: ancho, divs, hijos, imagenes, padre
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 05:40.