Skip to main content

Flex Gap

Use flex-gap utility classes to set the gap value for column gap, row gap or both in a flex layout.

Usage

Gap enums are defined numerically between 0.25em and 4em (following the same sliding scale as dimension enums), with the addition of the none enum.

:::

Gap - All sides

Compose gap utility classes for all sides as:

flex-gap--[enum]

Gap - Horizontal

Compose horizontal gap utility classes as:

flex-gap-h--[enum]

Gap - Vertical

Compose vertical gap utility classes as:

flex-gap-v--[enum]