Sizing

Max Width

Style syntax for setting the maximum width of an element.

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

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

Conditionally apply

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

<div class="max-w:full:hover max-w:full@sm max-w:full@dark max-w:full@print">…</div>

Style syntax for setting the maximum height of an element.

Style syntax for setting the minimum height of an element.

MIT License © Aoyue Design LLC.

Issue on this page