bordures de largeur de page pleine, contenu centré, meilleure façon?

Beaucoup de dessins sur lesquels je travaille actuellement nécessitent que la page soit centrée, j'utilise margin: 0 auto; largeur: 955;bordures de largeur de page pleine, contenu centré, meilleure façon?

Chaque section principale a une div avec une bordure inférieure, qui dans cette mise en page aurait une largeur de 955 au centre de l'écran.

Je souhaite toutefois que les bordures réelles soient sur toute la largeur de la page.

Quelle est la meilleure façon de le faire, proprement? Je l'ai fait de la même façon que StackOverflow utilise pour le pied de page mais si j'ai 3 bordures sur une page qui semble désordonnée?

Source

2010-02-17 ddd

Si vous êtes désireux d'avoir plusieurs sections qui sont brisées avec des frontières qui couvrent toute la largeur, votre meilleur pari est de structurer la page comme suit:

<body> 
    <div id="container" style="width: 100%;"> 
    <div style="width:100%;border-top:1px solid black;"> 
     <div style="width:955px; margin:0 auto;"> 
      Section 1 Content 
     </div> 
    </div> 
    <div style="width:100%;border-top:1px solid black;"> 
     <div style="width:955px; margin:0 auto;"> 
      Section 2 Content 
     </div> 
    </div> 
    <div style="width:100%;border-top:1px solid black;"> 
     <div style="width:955px; margin:0 auto;"> 
      Section 3 Content 
     </div> 
    </div> 
    </div> 
    <div id="footer" style="border-top: 1px solid black;"> 
    Footer Content 
    </div> 
</body>

Pour vous rendre la vie encore plus facile, Je recommande fortement de remplacer les styles en ligne par des noms de classe et en utilisant une feuille de style externe. De cette façon, vous pouvez attribuer à chaque section le même nom de classe et écrire les styles une seule fois.

Source

2010-02-17 15:13:25

bordures de largeur de page pleine, contenu centré, meilleure façon?

Répondre

Questions connexes