RSM RSM - 1 year ago 93
CSS Question

Correct way to do a css wrapper

I have heard a lot of my friends talk about using wrappers in CSS to center the "main" part of a website.

Is this the best way to accomplish this? What is best practice? Are there other ways?

Answer Source

Most basic example (live example here):


#wrapper {
    width: 500px;
    margin: 0 auto;


    <div id="wrapper">
        Piece of text inside a 500px width div centered on the page

How the principle works:

Create your wrapper and assign it a certain width. Then apply an automatic horizontal margin to it by using margin: 0 auto; or margin-left: auto; margin-right: auto;. The automatic margins make sure your element is centered.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download