Max height

Syntax

Class
Properties
max-h-{value}
max-height: {value};
max-h-min
max-height: min-content;
max-h-max
max-height: max-content;
max-h-full
max-height: 100%;
max-h-none
max-height: none;

Parameters

value
<length-percentage unsigned default-unit=1px>
<div class="t1 w-256 p-16 bg-c-white shadow-4 overflow-auto max-h-128"> Lorem ipsum dolorsitamet. </div>

Specification test cases

The test cases below are imported from the Turbo CSS specification. They have been executed upon loading this page.
Set maximum height to 1px without specifying the px unit.
t1 max-h-1
.t1.max-h-1 { max-height: 1px; }
Set maximum height to 1px with specifying the px unit.
t1 max-h-1px
.t1.max-h-1px { max-height: 1px; }
Set maximum height to 50% of its container.
t1 max-h-50%
.t1.max-h-50\% { max-height: 50%; }
Set maximum height to 100% of its container using the alias `full`.
t1 max-h-full
.t1.max-h-full { max-height: 100%; }
Set maximum height to none.
t1 max-h-none
.t1.max-h-none { max-height: none; }
Set maximum height to min-content.
t1 max-h-min
.t1.max-h-min { max-height: min-content; }
Set maximum height to max-content.
t1 max-h-max
.t1.max-h-max { max-height: max-content; }