EN
CSS - set element min height
0
points
In this article, we would like to show you how to set element min height using CSS.
Quick solution:
.element {
min-height: 100px;
}
Practical example
In this example, we use min-height CSS property to set element minimum height to 100px. If the height property percentage value will be calculated to less than 100px, the min-height property will prevent the element from shrinking vertically.
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<style>
body {
height: 100px;
}
div.element {
height: 1%; /* sets height to 1% of parent (body) height */
min-height: 100px;
background: orange;
}
</style>
</head>
<body>
<div class="element">Example text inside ...</div>
</body>
</html>