Max Block Size

Utilities for controlling the maximum block-size of an element.

Class CSS Output
max-block-auto
max-block-size: auto;
}
max-block-full
max-block-size: 100%;
}
max-block-screen
max-block-size: 100vh;
}
max-block-0
max-block-size: calc(var(--spacing) * 0);
}
max-block-4
max-block-size: calc(var(--spacing) * 4);
}
max-block-8
max-block-size: calc(var(--spacing) * 8);
}
max-block-1/2
max-block-size: calc(1/2 * 100%);
}
max-block-1/3
max-block-size: calc(1/3 * 100%);
}
max-block-[100px]
max-block-size: 100px;
}

max-block-auto

max-block-size: auto;

max-block-full

max-block-size: 100%;

max-block-screen

max-block-size: 100vh;

max-block-0

max-block-size: calc(var(--spacing) * 0);

max-block-4

max-block-size: calc(var(--spacing) * 4);

max-block-8

max-block-size: calc(var(--spacing) * 8);

max-block-1/2

max-block-size: calc(1/2 * 100%);

max-block-1/3

max-block-size: calc(1/3 * 100%);

max-block-[100px]

max-block-size: 100px;

Reference

CSS Properties

  • max-block-size