CSS: адаптивный способ центрирования жидкого div (без ширины px) при ограничении максимальной ширины?
Мы видели миллион вопросов о том, как центрировать элемент блока, и, кажется, есть пара популярных способов сделать это, но все они полагаются на фиксированную ширину пикселей. Тогда либоmargin:0 auto
или с абсолютным / относительным позиционированием иleft:50%; margin-left:[-1/2 width];
и т.д. Мы все знаем, что можемt работает, если ширина элемента установлена в%.
Неужели нет способа сделать это действительно плавным способом? Я'я говорю об использовании%
для ширины (не установка дюжины медиа-запросов с постоянно уменьшающейся шириной).
Осторожно: есть множество решений, которые используют модное слово "отзывчивый» ноне ответь на мой вопрос (потому что они используют фиксированную ширину в любом случае). Вотпример.
Обновить: Я почти забыл: как вы справляетесь с ограничением максимальной ширины центрированного элемента и все еще держите его в центре? Смотрите мой комментарий под @smdrager 'ответ. Пример из жизни. Я хочу, чтобы всплывающее сообщение или эффект светового окна, содержащий абзац текста, отображался по центру окна, а текст плавно переносился в зависимости от ширины. Но я неЯ не хочу, чтобы текстовое поле растянулось слишком далеко, чтобы текст было трудно прочитать (представьте 4-футовый экран с тремя абзацами, растянутыми на одну строку текста). Если вы добавите максимальную ширину для большинства подходов, центрированный прямоугольник перестанет центрироваться, когда будет достигнута максимальная ширина.