тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Свойство max-width

Свойство max-width устанавливает максимальную ширину элемента. Значением свойства служат любые единицы для размеров либо ключевое слово none, означающее отсутствие значения.

Обычно свойство задается для элемента с плавающей шириной (ширина задана в процентах или не задана вообще, а элемент по ширине раздвигается своим содержимым). Если ширина элемента задана в процентах - при увеличении окна браузера она будет увеличиваться, пока не достигнет значения max-width.

Синтаксис

селектор { max-width: значение; }

Пример

В данном примере ширина составляет процент от ширины родителя. Увеличьте окно браузера по ширине, и контейнер тоже увеличиться, чтобы подстроиться под ширину окна браузера. Однако он будет увеличиваться только до величины, определенной в max-width, это 900px. Как только контейнер достигнет этой ширины - он перестанет увеличиваться:

<div id="elem"></div> #elem { width: 70%; max-width: 900px; height: 300px; border: 1px solid black; }

:

Пример

В данном примере ширина контейнера ограничена с обоих сторон: он не сможет стать больше 900px и меньше 400px:

<div id="elem"></div> #elem { width: 70%; max-width: 900px; min-width: 400px; height: 300px; border: 1px solid black; }

:

Смотрите также

  • свойство min-width,
    которое задает минимальную ширину элемента
  • свойство max-height,
    которое задает максимальную высоту элемента
  • свойство max-height,
    которое задает минимальную высоту элемента