Landings

Tailwind CSS

Size

Utilities for setting the width and height of an element at the same time.

ClassProperties
size-0width: 0px;
height: 0px;
size-pxwidth: 1px;
height: 1px;
size-0.5width: 0.125rem; /* 2px /
height: 0.125rem; / 2px */
size-1width: 0.25rem; /* 4px /
height: 0.25rem; / 4px */
size-1.5width: 0.375rem; /* 6px /
height: 0.375rem; / 6px */
size-2width: 0.5rem; /* 8px /
height: 0.5rem; / 8px */
size-2.5width: 0.625rem; /* 10px /
height: 0.625rem; / 10px */
size-3width: 0.75rem; /* 12px /
height: 0.75rem; / 12px */
size-3.5width: 0.875rem; /* 14px /
height: 0.875rem; / 14px */
size-4width: 1rem; /* 16px /
height: 1rem; / 16px */
size-5width: 1.25rem; /* 20px /
height: 1.25rem; / 20px */
size-6width: 1.5rem; /* 24px /
height: 1.5rem; / 24px */
size-7width: 1.75rem; /* 28px /
height: 1.75rem; / 28px */
size-8width: 2rem; /* 32px /
height: 2rem; / 32px */
size-9width: 2.25rem; /* 36px /
height: 2.25rem; / 36px */
size-10width: 2.5rem; /* 40px /
height: 2.5rem; / 40px */
size-11width: 2.75rem; /* 44px /
height: 2.75rem; / 44px */
size-12width: 3rem; /* 48px /
height: 3rem; / 48px */
size-14width: 3.5rem; /* 56px /
height: 3.5rem; / 56px */
size-16width: 4rem; /* 64px /
height: 4rem; / 64px */
size-20width: 5rem; /* 80px /
height: 5rem; / 80px */
size-24width: 6rem; /* 96px /
height: 6rem; / 96px */
size-28width: 7rem; /* 112px /
height: 7rem; / 112px */
size-32width: 8rem; /* 128px /
height: 8rem; / 128px */
size-36width: 9rem; /* 144px /
height: 9rem; / 144px */
size-40width: 10rem; /* 160px /
height: 10rem; / 160px */
size-44width: 11rem; /* 176px /
height: 11rem; / 176px */
size-48width: 12rem; /* 192px /
height: 12rem; / 192px */
size-52width: 13rem; /* 208px /
height: 13rem; / 208px */
size-56width: 14rem; /* 224px /
height: 14rem; / 224px */
size-60width: 15rem; /* 240px /
height: 15rem; / 240px */
size-64width: 16rem; /* 256px /
height: 16rem; / 256px */
size-72width: 18rem; /* 288px /
height: 18rem; / 288px */
size-80width: 20rem; /* 320px /
height: 20rem; / 320px */
size-96width: 24rem; /* 384px /
height: 24rem; / 384px */
size-autowidth: auto;
height: auto;
size-1/2width: 50%;
height: 50%;
size-1/3width: 33.333333%;
height: 33.333333%;
size-2/3width: 66.666667%;
height: 66.666667%;
size-1/4width: 25%;
height: 25%;
size-2/4width: 50%;
height: 50%;
size-3/4width: 75%;
height: 75%;
size-1/5width: 20%;
height: 20%;
size-2/5width: 40%;
height: 40%;
size-3/5width: 60%;
height: 60%;
size-4/5width: 80%;
height: 80%;
size-1/6width: 16.666667%;
height: 16.666667%;
size-2/6width: 33.333333%;
height: 33.333333%;
size-3/6width: 50%;
height: 50%;
size-4/6width: 66.666667%;
height: 66.666667%;
size-5/6width: 83.333333%;
height: 83.333333%;
size-1/12width: 8.333333%;
height: 8.333333%;
size-2/12width: 16.666667%;
height: 16.666667%;
size-3/12width: 25%;
height: 25%;
size-4/12width: 33.333333%;
height: 33.333333%;
size-5/12width: 41.666667%;
height: 41.666667%;
size-6/12width: 50%;
height: 50%;
size-7/12width: 58.333333%;
height: 58.333333%;
size-8/12width: 66.666667%;
height: 66.666667%;
size-9/12width: 75%;
height: 75%;
size-10/12width: 83.333333%;
height: 83.333333%;
size-11/12width: 91.666667%;
height: 91.666667%;
size-fullwidth: 100%;
height: 100%;
size-minwidth: min-content;
height: min-content;
size-maxwidth: max-content;
height: max-content;
size-fitwidth: fit-content;
height: fit-content;