Я видел миллион вопросов о том, как центрировать элемент блока, и, кажется, есть пара популярных способов сделать это, но все они полагаются на фиксированную ширину пикселей. Тогда либоmargin:0 auto или с абсолютным / относительным позиционированием иleft:50%; margin-left:[-1/2 width]; и т.д. Мы все знаем, что это не может работать, если ширина элемента установлена в%.

Неужели нет способа сделать это действительно плавным способом? Я говорю об использовании% для ширины (не установка дюжины медиа-запросов с постоянно уменьшающейся шириной).

Осторожно: есть множество решений, в которых используется модное слово «отзывчивый», ноне ответь на мой вопрос (потому что они используют фиксированную ширину в любом случае). Вотпример.

Обновить: Я почти забыл: как вы справляетесь с ограничением максимальной ширины центрированного элемента и все еще держите его в центре? Смотрите мой комментарий под ответом @ smdrager. Пример из жизни. Я хочу, чтобы всплывающее сообщение или эффект светового окна, содержащий абзац текста, отображался по центру окна, а текст плавно переносился в зависимости от ширины. Но я не хочу, чтобы текстовое поле растянулось слишком далеко, где текст будет трудно читать (представьте 4-футовый экран с тремя абзацами, растянутыми на одну строку текста). Если вы добавите максимальную ширину для большинства подходов, центрированный прямоугольник перестанет центрироваться, когда будет достигнута максимальная ширина.