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

Иногда необходимо ограничить высоту элементов определёнными рамками. Два свойства выполняют эту функцию:

Значение:	<length> \| <percentage> \| inherit
Начальное:	0
Применяется:	ко всем элементам, за исключением незамещаемых инлайн-элементов и элементов таблицы
Наследуется:	нет
Процентное:	относительно высоты содержащего блока
Носитель:	визуальный

'max-height'

Значение:	<length> \| <percentage> \| none \| inherit
Начальное:	none
Применяется:	ко всем элементам, за исключением незамещаемых инлайн-элементов и элементов таблицы
Наследуется:	нет
Процентное:	относительно высоты содержащего блока
Носитель:	визуальный

Эти два свойства позволяют авторам ограничить высоту боксов определённым диапазоном. Значения имеют следующий смысл:

<length>

Специфицирует фиксированный минимум и максимум вычисленной высоты. <percentage>

Специфицирует проценты для определения вычисленного значения. Проценты высчитываются относительно высоты содержащего блока генерируемого бокса. Если высота содержащего блока не специфицирована явно (т.е. зависит от высоты содержимого), процентные значения интерпретируются так же, как 'auto'. none

(Только для 'max-height') Высота бокса не ограничена.

Следующий алгоритм описывает, как эти два свойства вводят вычисленное значение свойства 'height':

Высота вычисляется (без 'min-height' и 'max-height') по вышеприведённым правилам в "Вычислении высоты и полей".

Если вычисленное значение 'min-height' больше значения 'max-height', 'max-height' устанавливается в значение 'min-height'.

Если вычисленная высота больше, чем 'max-height', вновь применяются вышеприведённые

правила, но на этот раз с использованием значения 'max-height' как специфицированного значения для 'height'.

Если вычисленная высота меньше, чем 'min-height', вновь применяются вышеприведённые

правила, но на этот раз с использованием значения 'min-height'

как специфицированного значения для 'height'.

Содержание раздела