max-w-safe-dvw
|
max-width: calc(100dvw - env(safe-area-inset-left) - env(safe-area-inset-right));
|
max-w-safe-dvw-l
|
max-width: calc(100dvw - env(safe-area-inset-left));
|
max-w-safe-dvw-r
|
max-width: calc(100dvw - env(safe-area-inset-right));
|
container
|
width: 100%;
@variant sm { max-width: var(--breakpoint-sm); }/* 40rem */
@variant md { max-width: var(--breakpoint-md); }/* 48rem */
@variant lg { max-width: var(--breakpoint-lg); }/* 64rem */
@variant xl { max-width: var(--breakpoint-xl); }/* 80rem */
@variant 2xl { max-width: var(--breakpoint-2xl); }/* 96rem */
|
max-w-3xs
|
max-width: var(--container-3xs);/* 16rem */
|
max-w-3xl
|
max-width: var(--container-3xl);/* 48rem */
|
max-w-2xs
|
max-width: var(--container-2xs);/* 18rem */
|
max-w-2xl
|
max-width: var(--container-2xl);/* 42rem */
|
max-w-xs
|
max-width: var(--container-xs);/* 20rem */
|
max-w-xl
|
max-width: var(--container-xl);/* 36rem */
|
max-w-sm
|
max-width: var(--container-sm);/* 24rem */
|
max-w-screen
|
max-width: 100vw;
|
max-w-svw
|
max-width: 100svw;
|
max-w-svh
|
max-width: 100svh;
|
max-w-md
|
max-width: var(--container-md);/* 28rem */
|
max-w-min
|
max-width: min-content;
|
max-w-max
|
max-width: max-content;
|
max-w-lg
|
max-width: var(--container-lg);/* 32rem */
|
max-w-lvw
|
max-width: 100lvw;
|
max-w-lvh
|
max-width: 100lvh;
|
max-w-4xl
|
max-width: var(--container-4xl);/* 56rem */
|
max-w-5xl
|
max-width: var(--container-5xl);/* 64rem */
|
max-w-6xl
|
max-width: var(--container-6xl);/* 72rem */
|
max-w-7xl
|
max-width: var(--container-7xl);/* 80rem */
|
max-w-auto
|
max-width: auto;
|
max-w-px
|
max-width: 1px;
|
max-w-full
|
max-width: 100%;
|
max-w-fit
|
max-width: fit-content;
|
max-w-dvw
|
max-width: 100dvw;
|
max-w-dvh
|
max-width: 100dvh;
|
max-w-<number>
|
max-width: calc(var(--spacing) * <number>);/* 0.25rem */
|
max-w-4
|
max-width: calc(var(--spacing) * 4);
|
max-w-<fraction>
|
max-width: <percentage>;
|
max-w-1/2
|
max-width: 50%;
|
max-w-[<value>]
|
max-width: <value>;
|
max-w-[1rem]
|
max-width: 1rem;
|
max-w-(<custom-property>)
|
max-width: var(<custom-property>);
|
max-w-(--my-length)
|
max-width: var(--my-length);
|
max-w-(length:<custom-property>)
|
max-width: var(<custom-property>);
|
max-w-(length:--my-length)
|
max-width: var(--my-length);
|
max-w-safe-dvw-l-<number>
|
max-width: calc(100dvw - env(safe-area-inset-left, calc(var(--spacing) * <number>)));/* 0.25rem */
|
max-w-safe-dvw-l-4
|
max-width: calc(100dvw - env(safe-area-inset-left, calc(var(--spacing) * 4)));
|
max-w-safe-dvw-l-<fraction>
|
max-width: calc(100dvw - env(safe-area-inset-left, <percentage>));
|
max-w-safe-dvw-l-1/2
|
max-width: calc(100dvw - env(safe-area-inset-left, 50%));
|
max-w-safe-dvw-l-[<value>]
|
max-width: calc(100dvw - env(safe-area-inset-left, <value>));
|
max-w-safe-dvw-l-[1rem]
|
max-width: calc(100dvw - env(safe-area-inset-left, 1rem));
|
max-w-safe-dvw-l-(<custom-property>)
|
max-width: calc(100dvw - env(safe-area-inset-left, var(<custom-property>)));
|
max-w-safe-dvw-l-(--my-length)
|
max-width: calc(100dvw - env(safe-area-inset-left, var(--my-length)));
|
max-w-safe-dvw-l-(length:<custom-property>)
|
max-width: calc(100dvw - env(safe-area-inset-left, var(<custom-property>)));
|
max-w-safe-dvw-l-(length:--my-length)
|
max-width: calc(100dvw - env(safe-area-inset-left, var(--my-length)));
|
max-w-safe-dvw-r-<number>
|
max-width: calc(100dvw - env(safe-area-inset-right, calc(var(--spacing) * <number>)));/* 0.25rem */
|
max-w-safe-dvw-r-4
|
max-width: calc(100dvw - env(safe-area-inset-right, calc(var(--spacing) * 4)));
|
max-w-safe-dvw-r-<fraction>
|
max-width: calc(100dvw - env(safe-area-inset-right, <percentage>));
|
max-w-safe-dvw-r-1/2
|
max-width: calc(100dvw - env(safe-area-inset-right, 50%));
|
max-w-safe-dvw-r-[<value>]
|
max-width: calc(100dvw - env(safe-area-inset-right, <value>));
|
max-w-safe-dvw-r-[1rem]
|
max-width: calc(100dvw - env(safe-area-inset-right, 1rem));
|
max-w-safe-dvw-r-(<custom-property>)
|
max-width: calc(100dvw - env(safe-area-inset-right, var(<custom-property>)));
|
max-w-safe-dvw-r-(--my-length)
|
max-width: calc(100dvw - env(safe-area-inset-right, var(--my-length)));
|
max-w-safe-dvw-r-(length:<custom-property>)
|
max-width: calc(100dvw - env(safe-area-inset-right, var(<custom-property>)));
|
max-w-safe-dvw-r-(length:--my-length)
|
max-width: calc(100dvw - env(safe-area-inset-right, var(--my-length)));
|
