Centrar el contenido de una pagina con CSS

Stay hungry, stay foolish

Steve Jobs

Aquí les dejo un pequeño truco para centrar el contenido de una pagina con CSS, sin importar que el navegador cambie de tamaño el contenido siempre se va a ajustar al centro.

El estilo CSS es el siguiente:  al body le asignamos la propiedad de alineacion del texto centrada.

body { text-align: center; }

Al contenedor le asignamos las siguientes propiedades, para que el contenido este centrado a la propiedad margin le asignamos los siguientes valores: margen superior e inferior a 0 px y el margen izquierdo y derecho automatico, despues colocamos el ancho que queremos para la pagina, y alineamos el texto a la izquierda, si no ponemos esta ultima linea el texto quedara centrado ya que asi lo especificamos en body

#contenedor {
    margin: 0 auto;
    width: 750px;
    text-align: left;
}

Ejemplo:

<html>
    <head>
        <title>
            Centrar el contenido de una pagina con CSS
        </title>

        <style type="text/css">
            body {
                /* El texto se alinea a la derecha */
                text-align: center;
           }

           #contenedor {
               /* Ancho de la capa */
               width: 750px; 
              /* Margen superior e inferior 0 px
              margen derecho e izquierdo automatico*/
              margin: 0 auto;
              /* alineacion del texto a la izquierda*/
              text-align: left;
           }
       </style>
    </head>
    <body>
        <div id="contenedor">
            Este contenido esta centrado
        </div>
    </body>
</html>