¿Es esta la mejor manera de hacer que el ancho máximo <body> esté centrado?

Quiero que el contenido de una página web esté centrado y el ancho máximo de, digamos, 900px.¿Es esta la mejor manera de hacer que el ancho máximo <body> esté centrado?

De mi investigación y pruebas, parece que esta es la manera de hacerlo, pero quería confirmar:

<body style="max-width:900px; text-align:center;margin-left:auto ;margin-right:auto">

Obviamente, que había puesto el estilo en el CSS.

Y creo que cualquier persona con una pantalla grande va a tener un navegador bastante nuevo.

Fuente

2012-06-18 Clay Nichols

¿Por qué un ancho máximo y no un ancho fijo? ¿El "contenido centrado" se refiere tanto al cuerpo centrado como al cuerpo central * texto *? – BoltClock

CSS:

body { width: 100%; text-align: center; } 
#centerContainer { width: 900px; text-align: left; margin: 0px auto; }

HTML:

<body> 
    <div id="centerContainer">Content</div> 
</body>

Fuente

2012-06-18 18:39:42 David

La forma en que lo hago es mediante la creación de un envoltorio div que contendrá su contenido en la página.

CSS:

#wrapper{margin:0 auto; width:900px;}

HTML:

<div id="wrapper> 

<!--content goes here--> 

</div> <!--/wrapper-->

Fuente

2012-06-18 18:39:08 Mali

¿Por qué crearía un contenedor DIV en lugar de simplemente aplicar el estilo a la etiqueta ? –

Lo aplicaría a un DIV porque es posible que desee agregarle más estilos. Por ejemplo, quiero que mi cuerpo bg sea amarillo y mi bloque principal centrado de contenido ("envoltorio") sea azul. Supongo que lo que funcione mejor, ambos están bien para usar. Depende de tu objetivo final – Mali

¿Por qué no simplemente agregar un fondo a html, en ese caso tan especial? – Hejner

lugar de hacerlo en el cuerpo, me gustaría crear un div "contenedor" y el estilo de esta manera:

<div style="width: 900px; margin: auto;">Content</div>

Fuente

2012-06-18 18:39:46 callmedpit

En lugar de hacer <body>centrado, yo recomendaría hacer una <div> como envoltorio o contenedor con width: 900px.

HTML:

<body> 
    <div id="container"> 

    **Your Contents** 

    </div> 
</body>

CSS:

body{ 
    width: 100%; 
} 
#container { 
    width: 900px; 
    margin: 0 auto; 
}

Fuente

2012-06-18 18:39:53 Asif

¿Por qué utilizar un envoltorio a menos que y hasta que lo necesite? No envolvería las cosas de ninguna manera porque solo tú puedes, se acumula. Además, se puede utilizar la etiqueta de cuerpo como un "envoltorio libre" si quieres:

CSS:

html { 
    margin: 0 auto; 
    max-width: 900px; 
} 
body 
{ 
    /* whatever you want */ 
}

Fuente

2012-06-19 00:22:38 Johann

¿Es esta la mejor manera de hacer que el ancho máximo <body> esté centrado?

Respuesta

Cuestiones relacionadas