Максимальная высота элемента: max-height

max-height

Поддержка браузерами
Настольные браузеры Chrome Firefox Internet Explorer Opera Safari
Базовая поддержка, версии браузеров 1.0 1.0 7.0 7.0 1.0
Мобильные браузеры Android Firefox Mobile IE Phone Opera Mobile Safari Mobile
Базовая поддержка, версии браузеров 4.1.2 1.0 7.5 12.0 6.1.3
Свойство
max-height — это свойство задает максимальную высоту блочного элемента
Описание

Каждый элемент на странице представляет собой блок, этот блок имеет несколько составляющих — поля, границы, отступы и непосредственно сам контент:

Поля — margin

Границы — border

Отступы — padding

Контент

Каждая составляющая блока имеет четыре стороны, эти стороны имеют следующие названия:

width

Максимальная высота рассчитывается следующим образом:

таким образом если элементу присвоить следующее правило:

то высота будет равняться:

Наследование
Не наследуется. Это значит что стили применённые к родительскому элементу не передадутся потомкам
Применяется
К блочным элементам (кроме таблиц) и замещаемым встроенным элементам (к таким элементам относятся, например, изображения)

Существует возможность сделать из строчного элемента блочный, для этого к строчному элементу нужно применить свойство display со значением block

Может принимать значения
значение в абсолютных единицах | значение в относительных единицах | none | inherit
Значение по умолчанию
none
Правила записи
свойство: значение;
Примеры

<div>

<p>Максимальная высота этого абзаца 100 пикселей</p>

</div>

Поделиться