È questo il modo migliore per rendere la larghezza massima <body> centrata?

Desidero che il contenuto di una pagina Web sia centrato e la larghezza massima di, ad esempio 900 px.È questo il modo migliore per rendere la larghezza massima <body> centrata?

Dalla mia ricerca e sperimentazione, sembra che questo è il modo per farlo, ma ho voluto confermare:

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

Ovviamente, ci si mette la stile nel CSS.

E immagino che chiunque abbia un grande schermo avrà un browser abbastanza nuovo.

fonte

2012-06-18 Clay Nichols

Perchè un max-width e non una larghezza fissa? Il "contenuto centrato" significa sia il corpo centrato che il corpo centrato * testo *? – 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>

fonte

2012-06-18 18:39:42 David

Il modo in cui lo faccio è creare un div wrapper che trattiene il contenuto nella pagina.

CSS:

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

HTML:

<div id="wrapper> 

<!--content goes here--> 

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

fonte

2012-06-18 18:39:08 Mali

Perché dovresti creare un wrapper DIV invece di applicare semplicemente lo stile al tag ? –

Lo applicheremo a un DIV perché potrei voler aggiungere più stili ad esso. Ad esempio, voglio che il mio corpo bg sia giallo e il mio blocco principale di contenuti centrato ("wrapper") sia blu. Immagino che qualunque cosa funzioni meglio, entrambi sono ok da usare. Dipende dal tuo obiettivo finale. – Mali

Perché non aggiungere semplicemente uno sfondo ad html, in quel caso davvero speciale? – Hejner

Piuttosto che farlo sul corpo, vorrei creare un div "wrapper" e lo stile in questo modo:

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

fonte

2012-06-18 18:39:46 callmedpit

Piuttosto che fare <body>centrato, mi sento di raccomandare di fare un <div> come involucro o container con width: 900px.

HTML:

<body> 
    <div id="container"> 

    **Your Contents** 

    </div> 
</body>

CSS:

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

fonte

2012-06-18 18:39:53 Asif

Perché utilizzare un wrapper a meno che e fino a quando ne avete bisogno? Non vorrei incartare cose volenti o nolenti solo perché puoi, aggiunge. Inoltre, è possibile utilizzare il tag corpo come un "wrapper libero", se si desidera:

CSS:

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

fonte

2012-06-19 00:22:38 Johann

È questo il modo migliore per rendere la larghezza massima <body> centrata?

risposta

Problemi correlati