¿Cómo alinear múltiples divs en otro?

Así que aquí está mi HTML:

... 
[ [LEFT] [CENTER] [RIGHT] ]

El único CSS que tengo es:

 * { margin: 0px; } img.logo { display: block; margin-left: auto; margin-right: auto; } 

Realmente necesito ayuda para alinear los tres div en toda la página. También div.center debe tener el mismo tamaño que la imagen, también conocido como ancho – 800px y alto – 600px.

Parece mucho más una mesa que divisiones para mí …

 

Piense en CSS luego:

 table.header{ width: 100%; border-collapse: collapse; } table.header td{ vertical-align: top; border: 1px solid #404040; } table.header td.center{ width: 800px; height: 600px; } 

Esto es solo una muestra de código, entérate de la idea y adáptate a tus necesidades ^^

Agregue estas clases a su css

 .left { display:inline-block; width:25%; } .center { display:inline-block; width:50%; } .right { display:inline-block; width:25%; } 

Con el siguiente marcado, vienen a la mente 2 soluciones:

MARGEN

 
Some left test
Some right text

Solución n. ° 1

Flota hacia los lados izquierdo y derecho y usa display-block en el centro

VIOLÍN

Css

 .header { text-align: center; width:100%; } .left { float:left } .right { float:right; } .center { display:inline-block; } 

Solución n. ° 2

Use text-align: justify; en el elemento de encabezado.

A continuación, estire el contenido para tomar el ancho del 100%

VIOLÍN

CSS

 .header { text-align: justify; width:100%; } .header > div { display: inline-block; } .header:after { content: ''; display: inline-block; width: 100%; } 
 .left, .centre, .right { float:left; } 

Lo que flota: lo que queda es, hará que cada contenedor se organice desde la izquierda, de modo que obtienes:

[IZQUIERDA] – [CENTRO] – [DERECHA]