Sizing

Height

Style syntax for setting an element’s height.

🚧This page is still under construction and some content may not be complete.

Class	Declarations
`height:size` `/` `h:size`	`height: sizerem`
`h:full`	`height: size%`
`h:fit`	`height: fit-content`
`h:max`	`height: max-content`
`h:max`	`height: max-content`
`h:3xs` `/` `h:360`	`height: 30rem`
`h:2xs` `/` `h:480`	`height: 37.5rem`
`h:xs` `/` `h:600`	`height: 48rem`
`h:sm` `/` `h:768`	`height: 52.125rem`
`h:md` `/` `h:1024`	`height: 64rem`
`h:lg` `/` `h:1280`	`height: 80rem`
`h:xl` `/` `h:1440`	`height: 90rem`
`h:2xl` `/` `h:1600`	`height: sizerem`
`h:3xl` `/` `h:1920`	`height: 120rem`
`h:4xl` `/` `h:2560`	`height: 160rem`

Conditionally apply

Apply styles in different states using selectors, media queries, etc.

<div class="height:full:hover height:full@sm height:full@dark height:full@print">…</div>

Style syntax for setting how the total width and height of an element is calculated.

Style syntax for setting the maximum height of an element.

MIT License © Aoyue Design LLC.

Issue on this page