max-height
Максимальная высота: элемент растёт вместе с содержимым только до этого предела.
Синтаксис
max-height: value;Значения
| Параметр | Тип | Описание |
|---|---|---|
| px | length | Предел в пикселях. |
| vh | length | Доля высоты окна: `80vh`. |
| none | keyword | Без ограничения (по умолчанию). |
Примеры
Список, который прокручивается, когда становится выше 80 пикселей:
<ul style="max-height: 80px; overflow-y: auto; border: 1px solid gray; margin: 0;">
<li>Anna</li><li>Oleg</li><li>Maria</li><li>Ivan</li><li>Sofia</li><li>Pavel</li>
</ul>Примечания
Используйте max-height вместе с overflow: auto, иначе лишнее содержимое вылезет из блока.
См. также
- min-height — Минимальная высота: элемент не ниже этой высоты, но может расти.
- height — Высота элемента.
- overflow — Что делать с содержимым, которое не помещается в элемент.
Вопросы и ответы по теме
В учебнике
- Блочная модель — Из чего состоит элемент в CSS — содержимое, padding, border и margin, размеры, центрирование и box-sizing.