165
Mise en page
Si.on.analyse.la.structure.de.page,.il.apparaît.clairement.qu’il.faudra.un.élément.conteneur.
pour.centrer.la.mise.en.page,.ainsi.qu’un.en-tête,.une.zone.de.contenu.et.un.pied.de.page..
Le code.HTML.ressemblera.donc.à.ceci :



Comme.trois.zones.au.moins.sont.encloses.dans.le.conteneur.(wrapper),.commençons.par.
appliquer.les.styles.à.celui-ci..
Centrage d’une mise en page à l’aide des marges
Les.longues.lignes.de.texte.peuvent.être.difficiles.à.lire.et.déplaisantes.à.l’œil..Les.moniteurs.modernes.ne.cessant.de.s’agrandir,.la.question.de.la.lisibilité.à.l’écran.devient.de.plus.
en.plus.importante..L’un.des.moyens.par.lesquels.les.concepteurs.ont.tenté.de.résoudre.ce.
problème.consiste.à.centrer.la.mise.en.page..Au.lieu.de.couvrir.toute.la.largeur.de.l’écran,.
les.mises.en.page.centrées.n’en.occupent.qu’une.partie,.ce.qui.crée.des.lignes.plus.courtes.
et.plus.faciles.à.lire.
Supposons.que.vous.utilisiez.une.mise.en.page.classique.où.vous.souhaitez.centrer.la.div.
conteneur.horizontalement.à.l’écran :.



Pour.cela,.vous.devez.simplement.définir.sa.largeur.et.attribuer.la.valeur.auto.à.ses.marges.
horizontales :.
.wrapper {
width: 920px;
margin: 0 auto;
}