Свойство max-height


Свойство max-height позволяет указать максимальную высоту для элемента. Если высота элемента, рассчитанная на основе его содержимого или значения свойства height, окажется больше высоты, указанной в свойстве max-height, то высота элемента будет установлена на основании значения свойства max-height.

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

Синтаксис
max-height: inherit | none | «размер» | «процентное значение»
Возможные значения и ключевые слова
inheritзначение родительского элемента
noneнет ограничения на высоту
«размер»линейный размер, заданный дизайнером
«процентное значение»по отношению к высоте родительского элемента
Разное
Значение по умолчаниюnone
Применимоко всем элементам, исключая незаменяемые строковые элементы и табличные элементы
Наследованиенет
Процентная записьпо отношению к высоте родительского элемента
Mediavisual

В следующем примере определяется класс «news», для которого заданы, при помощи свойств min-height и max-height, ограничения по высоте от 100px до 400px. Если высота, вычисленная браузером, будет меньше или больше указанного ограничения, то браузер будет использовать в качестве высоты значение либо свойства min-height, либо свойства max-height (соответственно если вычисленная высота будет меньше или больше разрешенного диапазона).

.news {min-height:100px; max-height:100px;}

Примечание: Internet Explorer не поддерживает свойство max-width по версию 6.0 включительно.

Примечание: Netscape Navigator поддерживает свойство max-width начиная с версии 6.0

Примечание: Opera поддерживает свойство max-width начиная с версии 4.0

Навигация