Min Height

Set the minimum height of an element.

Widely available

This feature is well established and works across many devices and browser versions.

Chrome
Edge
Firefox
Safari

min-h-0
min-height: 0;
min-h-1
min-height: .25rem;
min-h-2
min-height: .5rem;
min-h-3
min-height: .75rem;
min-h-4
min-height: 1rem;
min-h-5
min-height: 1.25rem;
min-h-6
min-height: 1.5rem;
min-h-7
min-height: 1.75rem;
min-h-8
min-height: 2rem;
min-h-9
min-height: 2.25rem;
min-h-10
min-height: 2.5rem;
min-h-11
min-height: 2.75rem;
min-h-12
min-height: 3rem;
min-h-13
min-height: 3.25rem;
min-h-14
min-height: 3.5rem;
min-h-15
min-height: 3.75rem;
min-h-16
min-height: 4rem;
min-h-17
min-height: 4.25rem;
min-h-18
min-height: 4.5rem;
min-h-19
min-height: 4.75rem;
min-h-20
min-height: 5rem;
min-h-21
min-height: 5.25rem;
min-h-22
min-height: 5.5rem;
min-h-23
min-height: 5.75rem;
min-h-24
min-height: 6rem;
min-h-25
min-height: 6.25rem;
min-h-26
min-height: 6.5rem;
min-h-27
min-height: 6.75rem;
min-h-28
min-height: 7rem;
min-h-29
min-height: 7.25rem;
min-h-30
min-height: 7.5rem;
min-h-31
min-height: 7.75rem;
min-h-32
min-height: 8rem;
min-h-33
min-height: 8.25rem;
min-h-34
min-height: 8.5rem;
min-h-35
min-height: 8.75rem;
min-h-36
min-height: 9rem;
min-h-37
min-height: 9.25rem;
min-h-38
min-height: 9.5rem;
min-h-39
min-height: 9.75rem;
min-h-40
min-height: 10rem;
min-h-41
min-height: 10.25rem;
min-h-42
min-height: 10.5rem;
min-h-43
min-height: 10.75rem;
min-h-44
min-height: 11rem;
min-h-45
min-height: 11.25rem;
min-h-46
min-height: 11.5rem;
min-h-47
min-height: 11.75rem;
min-h-48
min-height: 12rem;
min-h-49
min-height: 12.25rem;
min-h-50
min-height: 12.5rem;
min-h-51
min-height: 12.75rem;
min-h-52
min-height: 13rem;
min-h-53
min-height: 13.25rem;
min-h-54
min-height: 13.5rem;
min-h-55
min-height: 13.75rem;
min-h-56
min-height: 14rem;
min-h-57
min-height: 14.25rem;
min-h-58
min-height: 14.5rem;
min-h-59
min-height: 14.75rem;
min-h-60
min-height: 15rem;
min-h-61
min-height: 15.25rem;
min-h-62
min-height: 15.5rem;
min-h-63
min-height: 15.75rem;
min-h-64
min-height: 16rem;
min-h-65
min-height: 16.25rem;
min-h-66
min-height: 16.5rem;
min-h-67
min-height: 16.75rem;
min-h-68
min-height: 17rem;
min-h-69
min-height: 17.25rem;
min-h-70
min-height: 17.5rem;
min-h-71
min-height: 17.75rem;
min-h-72
min-height: 18rem;
min-h-73
min-height: 18.25rem;
min-h-74
min-height: 18.5rem;
min-h-75
min-height: 18.75rem;
min-h-76
min-height: 19rem;
min-h-77
min-height: 19.25rem;
min-h-78
min-height: 19.5rem;
min-h-79
min-height: 19.75rem;
min-h-80
min-height: 20rem;
min-h-81
min-height: 20.25rem;
min-h-82
min-height: 20.5rem;
min-h-83
min-height: 20.75rem;
min-h-84
min-height: 21rem;
min-h-85
min-height: 21.25rem;
min-h-86
min-height: 21.5rem;
min-h-87
min-height: 21.75rem;
min-h-88
min-height: 22rem;
min-h-89
min-height: 22.25rem;
min-h-90
min-height: 22.5rem;
min-h-91
min-height: 22.75rem;
min-h-92
min-height: 23rem;
min-h-93
min-height: 23.25rem;
min-h-94
min-height: 23.5rem;
min-h-95
min-height: 23.75rem;
min-h-96
min-height: 24rem;
min-h-97
min-height: 24.25rem;
min-h-98
min-height: 24.5rem;
min-h-99
min-height: 24.75rem;
min-h-100
min-height: 25rem;
min-h-auto
min-height: auto;
min-h-dvh
min-height: 100dvh;
min-h-dvw
min-height: 100dvw;
min-h-vh
min-height: 100vh;
min-h-vw
min-height: 100vw;
min-h-vi
min-height: 100vi;
min-h-vb
min-height: 100vb;
min-h-svh
min-height: 100svh;
min-h-svw
min-height: 100svw;
min-h-lvh
min-height: 100lvh;
min-h-lvw
min-height: 100lvw;
min-h-vmin
min-height: 100vmin;
min-h-vmax
min-height: 100vmax;
min-h-fc
min-height: fit-content;
min-h-full
min-height: 100%;
min-h-half
min-height: 50%;
min-h-max
min-height: max-content;
min-h-min
min-height: min-content;
min-h-px
min-height: 1px;
min-h-s
min-height: stretch;
min-h-sm
min-height: 40rem;
min-h-md
min-height: 48rem;
min-h-lg
min-height: 64rem;
min-h-xl
min-height: 80rem;
min-h-xxl
min-height: 96rem;

Responsiveness

Use breakpoint prefixes to target different screen sizes. Styles apply from the breakpoint & up.

Target viewport sizes with breakpoint prefixes.

sm:min-h-(value)
Small≥640px
md:min-h-(value)
Medium≥768px
lg:min-h-(value)
Large≥1024px
xxl:min-h-(value)
Extra Large≥1536px

Hover State

Apply styles conditionally on hover using the h: prefix.

Add the h: prefix to apply styles only when the user hovers over the element.

Syntax:h:min-h-(value)