Dovremmo impostare la larghezza su div # wrapper o <body>?

Un sacco di markup HTML della gente assomiglia a questo:Dovremmo impostare la larghezza su div # wrapper o <body>?

<html> 
    <body> 
    <div id="wrapper"> 
     <p>Stuff in here</p> 
    </div> 
    </body> 
</html>

E la maggior parte del tempo negli esempi qui, o sul web, la gente suggeriscono che si dovrebbe applicare impostazioni di larghezza alla #wrapper, al posto del <body>.

C'è una ragione di fondo per questo?

Per esempio, in un articolo su techniques for gracefully degrading media queries, e per darvi qualche contesto il Tecnica 1: Nessuna azione:

L'elefante nella stanza è Internet Explorer per il desktop. Con una soluzione mobile-first, gli schermi di grandi dimensioni visualizzeranno il contenuto in una colonna, risultando in una dolorosa esperienza di lettura per l'utente, superando il massimo stabilito per il comfort: da 50 a 75 caratteri. Potrebbe valere la pena impostare una proprietà di larghezza massima nel contenitore principale e quindi aumentare tale larghezza massima in una query multimediale.

E il loro CSS:

#wrapper { 
_width: 460px; /* Take that, IE6! */ 
max-width: 460px; 
} 

@media only screen and (width) { 

#wrapper { 
    max-width: 1200px; 
} 
}

Ecco how it'd come together for IE (media query è commentata).

Ci sarebbe qualche differenza per cui invece di applicarlo a #wrapper, lo applicheremo a <body> - con in mente il sito web standard?

Eventuali bug? I tried it here, e sembra essere OK. Che cosa succede se il layout diventa più avanzato ...

fonte

2012-11-03 Baumr

Non c'è un vero motivo per avere un wrapper div in questi giorni. – BoltClock

Figure. Ma come mai? – Baumr

Beh, vuoi usare il minor numero possibile di elementi, immagino. Tuttavia ci sono molti casi in cui # page-wrapper e body non sono intercambiabili. In molte situazioni è necessario utilizzare il corpo come colore di sfondo anziché il tag html. In questi casi (per esempio i footer ponderati) è necessario che il corpo distenda l'html e che sia necessario un involucro per contenere il contenuto, magari centrare il contenuto e forzare il corpo a distenderlo e a contenerlo.

Quindi, penso che direi che la maggior parte delle persone usa un wrapper perché lo ha visto nella loro prima lezione o tutorial online. Penso che per la maggior parte, è un'abitudine per molti. Vorrei lasciare il corpo così com'è e margine il wrapper a 0 auto e usare una larghezza massima come hai tu. È solo EI 8 e precedenti - can I use media queries ? - forse dovresti rilevare EI 8 e creare un foglio di stile unico. Trovo che dopo aver definito tutto per mobil, le mie query sui media sono solo alcune righe di iterazione dopo questo -

fonte

2012-11-05 03:22:12 sheriffderek

+1 per "perché lo hanno visto nella loro prima classe". So per me che è un habbit perché i clienti tendono sempre a cambiare idea in qualche modo ed è più facile avere dentro che uscire e giocherellare con esso più tardi e, naturalmente, l'ho imparato in quel modo! –

Dovremmo impostare la larghezza su div # wrapper o <body>?

risposta

Problemi correlati