In this section, we will learn what the min-height property is and how to use it in CSS.

CSS min-height Property Definition and Usage

The `min-height` property is used to set a limit on the minimum height of an element.

Basically using this property, we can set a limit on the minimum height that an element can have.

Note: again, using the min-height property won’t fix the height of an element! This property just put a limit on the minimum height that an element can take! If you want to fix the height of an element, use the height property, then.

CSS min-height Property Syntax

min-height: length|initial|inherit;

CSS min-height Property Value

The value we set for this property is a number with any relative or absolute units supported in CSS.

For example, if we set the value 10vh for this property, that means the min-height is 10 percent of the viewport’s height.

If you used % value for this property, be aware that the parent element should have a fixed height otherwise, your declaration won’t work. Check the height section to learn more about this.

Example: min-height in CSS

See the Pen min-height in CSS by Enjoy Tutorials (@enjoytutorials) on CodePen.