Is this the best way to make the <body> max-width and centered?

css

Why use a wrapper unless and until you need it? I wouldn't wrap stuff nilly-willy just because you can, it adds up. Also, you can use the Body tag as a "free wrapper" if you want:

CSS:

html {
    margin:    0 auto;
    max-width: 900px;
}

body {
    /* whatever you want */
}

CSS:

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

HTML:

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

Rather than make <body> centered, I would recommend to make a <div> as a wrapper or container with width: 900px.

HTML:

<body>
   <div id="container">

   **Your Contents**

   </div>
</body>

CSS:

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

The way I do it is by creating a wrapper div that will hold your content on the page.

CSS:

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

HTML:

<div id="wrapper>

<!--content goes here-->

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

Rather than doing it on body, I would create a "wrapper" div and style it this way:

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

Is this the best way to make the <body> max-width and centered?

Related

Recent Posts