Как работает свойство CSS height в сочетании с другими свойствами?

Свойство CSS height устанавливает высоту области содержимого элемента с учётом внутренних и внешних отступов и рамки border. tuhub.ru htmlacademy.ru

Некоторые свойства, которые влияют на работу height в сочетании с другими:

• box-sizing. htmlacademy.ru Если это свойство не задано, то размер внутренней области определяется height и width. htmlacademy.ru Если значение box-sizing задано, то оно определяет, какой области указаны размеры. htmlacademy.ru
• min-height. htmlacademy.ru doka.guide Если задать минимальную высоту элемента с помощью этого свойства, то элемент сможет растягиваться на большую высоту, если того требует контент, размещённый внутри, но никогда не сожмётся по высоте меньше, чем указано в свойстве min-height. doka.guide
• max-height. htmlacademy.ru doka.guide Свойство применяется, если важно сохранить определённую максимальную высоту, больше которой элемент не должен растягиваться. htmlacademy.ru
• overflow. htmlacademy.ru Если важно сохранить максимальную высоту, но нужно добавить текст, поможет это свойство. htmlacademy.ru Когда контент превышает указанную высоту или ширину, свойство позволяет поместить всё в блок, при этом не увеличивая его площадь. htmlacademy.ru

Также есть значение auto для свойства height. tuhub.ru developer.mozilla.org В этом случае браузер будет сам высчитывать и выбирать высоту элемента, основываясь на его обычном потоке. tuhub.ru

Важно учитывать, что совместное использование свойств height и min-height может вносить путаницу, поскольку браузеры могут не учитывать приоритет одного свойства перед другим. sky.pro