Width (`width`)

Preview
Source

Auto (width-auto)

Full (100%) (width-full)

Viewport (100vh) (width-viewport)

0 (width-0)

4 (width-05)

8 (width-1)

12 (width-105)

16 (width-2)

20 (width-205)

24 (width-3)

32 (width-4)

40 (width-5)

48 (width-6)

56 (width-7)

64 (width-8)

72 (width-9)

80 (width-10)

160 (width-card)

240 (width-card-lg)

320 (width-mobile)

480 (width-mobile-lg)

640 (width-tablet)

880 (width-tablet-lg)

1024 (width-desktop)

1200 (width-desktop-lg)

1400 (width-widescreen)

<p class="width-auto bg-primary-lighter padding-1 maxw-full">Auto (width-auto)</p> <p class="width-full bg-primary-lighter padding-1 maxw-full">Full (100%) (width-full)</p> <p class="width-viewport bg-primary-lighter padding-1 maxw-full">Viewport (100vh) (width-viewport)</p> <p class="width-0 bg-primary-lighter padding-1 maxw-full">0 (width-0)</p> <p class="width-05 bg-primary-lighter padding-1 maxw-full">4 (width-05)</p> <p class="width-1 bg-primary-lighter padding-1 maxw-full">8 (width-1)</p> <p class="width-105 bg-primary-lighter padding-1 maxw-full">12 (width-105)</p> <p class="width-2 bg-primary-lighter padding-1 maxw-full">16 (width-2)</p> <p class="width-205 bg-primary-lighter padding-1 maxw-full">20 (width-205)</p> <p class="width-3 bg-primary-lighter padding-1 maxw-full">24 (width-3)</p> <p class="width-4 bg-primary-lighter padding-1 maxw-full">32 (width-4)</p> <p class="width-5 bg-primary-lighter padding-1 maxw-full">40 (width-5)</p> <p class="width-6 bg-primary-lighter padding-1 maxw-full">48 (width-6)</p> <p class="width-7 bg-primary-lighter padding-1 maxw-full">56 (width-7)</p> <p class="width-8 bg-primary-lighter padding-1 maxw-full">64 (width-8)</p> <p class="width-9 bg-primary-lighter padding-1 maxw-full">72 (width-9)</p> <p class="width-10 bg-primary-lighter padding-1 maxw-full">80 (width-10)</p> <p class="width-card bg-primary-lighter padding-1 maxw-full">160 (width-card)</p> <p class="width-card-lg bg-primary-lighter padding-1 maxw-full">240 (width-card-lg)</p> <p class="width-mobile bg-primary-lighter padding-1 maxw-full">320 (width-mobile)</p> <p class="width-mobile-lg bg-primary-lighter padding-1 maxw-full">480 (width-mobile-lg)</p> <p class="width-tablet bg-primary-lighter padding-1 maxw-full">640 (width-tablet)</p> <p class="width-tablet-lg bg-primary-lighter padding-1 maxw-full">880 (width-tablet-lg)</p> <p class="width-desktop bg-primary-lighter padding-1 maxw-full">1024 (width-desktop)</p> <p class="width-desktop-lg bg-primary-lighter padding-1 maxw-full">1200 (width-desktop-lg)</p> <p class="width-widescreen bg-primary-lighter padding-1 maxw-full">1400 (width-widescreen)</p>