Centrar todo el bloque vs contenido

 ¡Exacto! La forma más fácil es usar margin: 0 auto;. Aquí tienes las opciones más simples:

Opción 1: La más fácil (solo centrar el texto)

css

.contenido {
    margin-left: 240px;
    padding: 20px;
    max-width: 800px;
    text-align: center;  /* Solo centra el texto */
}

Opción 2: Centrar todo el bloque (lo que buscas)

css

.contenido {
    margin-left: 240px;
    padding: 20px;
    max-width: 800px;
    margin-right: auto;  /* Centra automáticamente */
    /* O también puedes usar: */
    /* margin: 0 auto 0 240px; */  /* superior | horizontal | inferior | izquierdo */
}

Opción 3: La más limpia (recomendada)

css

.contenido {
    margin: 0 auto 0 240px;  /* arriba | auto (centrado) | abajo | izquierda */
    padding: 20px;
    max-width: 800px;
}

Opción 4: Si quieres centrado perfecto (como la imagen)

css

.contenido {
    margin-left: 260px;  /* 240px del menú + 20px de espacio */
    margin-right: auto;
    padding: 20px;
    max-width: 800px;
    width: calc(100% - 300px); /* Para que sea responsivo */
}

La Opción 3 es la más fácil y elegante: margin: 0 auto 0 240px;

Esto significa:

• 0: margen superior

• auto: margen horizontal automático (centra)

• 0: margen inferior

• 240px: margen izquierdo (para el menú lateral)