Lo que #page haciendo fue agregar un envoltorio alrededor de #page . No es lo que me gustaría en un mundo perfecto, pero me gustaría min-margin en un mundo perfecto (o al menos margin: min() )!

En el contenedor, apliqué el margin: 0 13.25em; donde el 13.25em era donde quería que #page dejara de deslizar hacia la izquierda. Los márgenes iguales en ambos lados dejan #page centrada sin un cambio de 13.25em a la derecha. Como utilicé márgenes en lugar de relleno, el lado derecho puede desbordar el navegador sin hacer que aparezca la barra de desplazamiento horizontal.

Parece ser una buena solución. Originalmente había estado buscando algo más “inteligente” sin agregar HTML, pero esto era lo suficientemente simple y parece lo suficientemente eficaz como para que valga la pena el margen adicional.

Si no usa un borde para el elemento, puede usarlo para definir un “margen mínimo”.

 .center { margin: 0px auto; border: transparent solid 30px; } 

PD. Sé que esta es una vieja pregunta, pero el OP también comentó este mes.

Proporcione el ancho y la altura exactos al centro de la clase. luego establezca la posición en absoluta: digamos que queremos establecer el ancho: 400px; y altura: 300px; intenta seguir la pieza de código para el centro

 .center { postion:absolute; width:400px; height:300px; top:50%; left:50%; margin-top:-200px; margin-left:-150px; }