Sections

Min height

Utilities for setting the minimum height of an element.

Class Properties
.min-h-0 min-height: 0;
.min-h-full min-height: 100%;
.min-h-screen min-height: 100vh;

Usage

Use .min-h-0, .min-h-full, or .min-h-screen to set the minimum height of an element.

Variants

By default, only responsive variants are generated for min height utilities.

Responsive

To control the minimum height of an element at a specific breakpoint, add a {screen}: prefix to any existing min height utility.

For example, use .md:min-h-full to apply the min-h-full utility at only medium screen sizes and above.

Hover-state

To include hover-state variants like .hover:min-h-full, add "min-height" to the $hover-variants variable when recompiling your CSS:

$hover-variants: (
  // ...
  "min-height",
);