@ agnasg

agnasg


¿Cómo centrar múltiples divs horizontalmente?

30-04-2013 10:02 AM

Nuestra primera aproximación a este problema va a ser un simple:

[cce]

float:left;

[/cce]

Cómo eso no funciona en lo absoluto tenemos que recurrir a google. La respuesta más común en google es algo así como:
[cce]
.parent
{
text-align:center;
display: block;
border: 1px solid red;
}
.child
{
display: inline-block;
border: 1px solid black;
width: 100px;
}
[/cce]
donde parent es la clase del div principal y child la clase de los divs que vamos a centrar. Luego de algunas pruebas llegué a la conclusión de que esto solamente funciona (+/-) en FF, Chrome e IE9. En IE8 falla miserablemente.

4 horas después mi solución fue más o menos la misma que al comienzo pero con unos detalles adicionales:
[cce]
.imyourfather {

text-align: left;
vertical-align: middle;
margin: 0px auto;

}

.child {

margin-right: 3px;
float:left;

}
[/cce]

Por qué esto tiende a fallar al comienzo y luego de 4 horas no deja de funcionar no tengo idea realmente. css+IE8 es un potro difícil de domar, no tengo paciencia para esperar el día  en que ya no tengamos que darle más soporte a ese engendro del demonio. Yo creo que fue IE lo que enloqueció  a los personajes de Rabbits.

 

2 respuestas a “¿Cómo centrar múltiples divs horizontalmente?”

  1. Jorge Palacios dice:

    Yo siempre he resuelto con #obi { margin: 0 auto 0; }. Prueba a ver qué tal.

  2. admin dice:

    Sí eso centra un div pero el caso del que hablo es múltiples div’s , es decir varios div’s.