Flex

CSS variables

Expand or collapse columnSelectorVariableValue
.pf-v6-l-flex--pf-v6-l-flex--Display
flex
.pf-v6-l-flex--pf-v6-l-flex--FlexWrap
wrap
.pf-v6-l-flex--pf-v6-l-flex--AlignItems
baseline
.pf-v6-l-flex--pf-v6-l-flex--m-row--AlignItems
baseline
.pf-v6-l-flex--pf-v6-l-flex--m-row-reverse--AlignItems
baseline
.pf-v6-l-flex--pf-v6-l-flex--item--Order
0
.pf-v6-l-flex--pf-v6-l-flex--spacer--column--base
1rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--row--base
0.5rem
.pf-v6-l-flex--pf-v6-l-flex--RowGap
0.5rem
.pf-v6-l-flex--pf-v6-l-flex--ColumnGap
0
.pf-v6-l-flex--pf-v6-l-flex--m-gap--RowGap
0.5rem
.pf-v6-l-flex--pf-v6-l-flex--m-gap--ColumnGap
1rem
.pf-v6-l-flex--pf-v6-l-flex--m-row-gap--RowGap
0.5rem
.pf-v6-l-flex--pf-v6-l-flex--m-column-gap--ColumnGap
1rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--none
0
.pf-v6-l-flex--pf-v6-l-flex--spacer--xs
0.25rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--sm
0.5rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--md
1rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--lg
1.5rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--xl
2rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--2xl
3rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--3xl
4rem
.pf-v6-l-flex--pf-v6-l-flex--spacer--4xl
5rem
.pf-v6-l-flex > *--pf-v6-l-flex--spacer
initial
.pf-v6-l-flex > *--pf-v6-l-flex--spacer--column
initial, 1rem
.pf-v6-l-flex > *--pf-v6-l-flex--spacer--row
initial, 0.5rem
.pf-v6-l-flex > *:last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-inline-flex--pf-v6-l-flex--Display
inline-flex
.pf-v6-l-flex.pf-m-column--pf-v6-l-flex--RowGap
0
.pf-v6-l-flex.pf-m-column--pf-v6-l-flex--ColumnGap
1rem
.pf-v6-l-flex.pf-m-space-items-none > *--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-none > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-xs > *--pf-v6-l-flex--spacer
0.25rem
.pf-v6-l-flex.pf-m-space-items-xs > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-sm > *--pf-v6-l-flex--spacer
0.5rem
.pf-v6-l-flex.pf-m-space-items-sm > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-md > *--pf-v6-l-flex--spacer
1rem
.pf-v6-l-flex.pf-m-space-items-md > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-lg > *--pf-v6-l-flex--spacer
1.5rem
.pf-v6-l-flex.pf-m-space-items-lg > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-xl > *--pf-v6-l-flex--spacer
2rem
.pf-v6-l-flex.pf-m-space-items-xl > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-2xl > *--pf-v6-l-flex--spacer
3rem
.pf-v6-l-flex.pf-m-space-items-2xl > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-3xl > *--pf-v6-l-flex--spacer
4rem
.pf-v6-l-flex.pf-m-space-items-3xl > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex.pf-m-space-items-4xl > *--pf-v6-l-flex--spacer
5rem
.pf-v6-l-flex.pf-m-space-items-4xl > :last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex .pf-m-spacer-none--pf-v6-l-flex--spacer
0
.pf-v6-l-flex .pf-m-spacer-none:last-child--pf-v6-l-flex--spacer
0
.pf-v6-l-flex .pf-m-spacer-xs--pf-v6-l-flex--spacer
0.25rem
.pf-v6-l-flex .pf-m-spacer-xs:last-child--pf-v6-l-flex--spacer
0.25rem
.pf-v6-l-flex .pf-m-spacer-sm--pf-v6-l-flex--spacer
0.5rem
.pf-v6-l-flex .pf-m-spacer-sm:last-child--pf-v6-l-flex--spacer
0.5rem
.pf-v6-l-flex .pf-m-spacer-md--pf-v6-l-flex--spacer
1rem
.pf-v6-l-flex .pf-m-spacer-md:last-child--pf-v6-l-flex--spacer
1rem
.pf-v6-l-flex .pf-m-spacer-lg--pf-v6-l-flex--spacer
1.5rem
.pf-v6-l-flex .pf-m-spacer-lg:last-child--pf-v6-l-flex--spacer
1.5rem
.pf-v6-l-flex .pf-m-spacer-xl--pf-v6-l-flex--spacer
2rem
.pf-v6-l-flex .pf-m-spacer-xl:last-child--pf-v6-l-flex--spacer
2rem
.pf-v6-l-flex .pf-m-spacer-2xl--pf-v6-l-flex--spacer
3rem
.pf-v6-l-flex .pf-m-spacer-2xl:last-child--pf-v6-l-flex--spacer
3rem
.pf-v6-l-flex .pf-m-spacer-3xl--pf-v6-l-flex--spacer
4rem
.pf-v6-l-flex .pf-m-spacer-3xl:last-child--pf-v6-l-flex--spacer
4rem
.pf-v6-l-flex .pf-m-spacer-4xl--pf-v6-l-flex--spacer
5rem
.pf-v6-l-flex .pf-m-spacer-4xl:last-child--pf-v6-l-flex--spacer
5rem
.pf-v6-l-flex.pf-m-gap--pf-v6-l-flex--RowGap
0.5rem
.pf-v6-l-flex.pf-m-gap--pf-v6-l-flex--ColumnGap
1rem
.pf-v6-l-flex.pf-m-gap-none--pf-v6-l-flex--RowGap
0
.pf-v6-l-flex.pf-m-gap-none--pf-v6-l-flex--ColumnGap
0
.pf-v6-l-flex.pf-m-gap-xs--pf-v6-l-flex--RowGap
0.25rem
.pf-v6-l-flex.pf-m-gap-xs--pf-v6-l-flex--ColumnGap
0.25rem
.pf-v6-l-flex.pf-m-gap-sm--pf-v6-l-flex--RowGap
0.5rem
.pf-v6-l-flex.pf-m-gap-sm--pf-v6-l-flex--ColumnGap
0.5rem
.pf-v6-l-flex.pf-m-gap-md--pf-v6-l-flex--RowGap
1rem
.pf-v6-l-flex.pf-m-gap-md--pf-v6-l-flex--ColumnGap
1rem
.pf-v6-l-flex.pf-m-gap-lg--pf-v6-l-flex--RowGap
1.5rem
.pf-v6-l-flex.pf-m-gap-lg--pf-v6-l-flex--ColumnGap
1.5rem
.pf-v6-l-flex.pf-m-gap-xl--pf-v6-l-flex--RowGap
2rem
.pf-v6-l-flex.pf-m-gap-xl--pf-v6-l-flex--ColumnGap
2rem
.pf-v6-l-flex.pf-m-gap-2xl--pf-v6-l-flex--RowGap
3rem
.pf-v6-l-flex.pf-m-gap-2xl--pf-v6-l-flex--ColumnGap
3rem
.pf-v6-l-flex.pf-m-gap-3xl--pf-v6-l-flex--RowGap
4rem
.pf-v6-l-flex.pf-m-gap-3xl--pf-v6-l-flex--ColumnGap
4rem
.pf-v6-l-flex.pf-m-gap-4xl--pf-v6-l-flex--RowGap
5rem
.pf-v6-l-flex.pf-m-gap-4xl--pf-v6-l-flex--ColumnGap
5rem
.pf-v6-l-flex:is(.pf-m-gap, .pf-m-gap-none, .pf-m-gap-xs, .pf-m-gap-sm, .pf-m-gap-md, .pf-m-gap-lg, .pf-m-gap-xl, .pf-m-gap-2xl, .pf-m-gap-3xl, .pf-m-gap-4xl) > *--pf-v6-l-flex--spacer--row
0
.pf-v6-l-flex:is(.pf-m-gap, .pf-m-gap-none, .pf-m-gap-xs, .pf-m-gap-sm, .pf-m-gap-md, .pf-m-gap-lg, .pf-m-gap-xl, .pf-m-gap-2xl, .pf-m-gap-3xl, .pf-m-gap-4xl) > *--pf-v6-l-flex--spacer--column
0
.pf-v6-l-flex.pf-m-row-gap--pf-v6-l-flex--RowGap
0.5rem
.pf-v6-l-flex.pf-m-row-gap-none--pf-v6-l-flex--RowGap
0
.pf-v6-l-flex.pf-m-row-gap-xs--pf-v6-l-flex--RowGap
0.25rem
.pf-v6-l-flex.pf-m-row-gap-sm--pf-v6-l-flex--RowGap
0.5rem
.pf-v6-l-flex.pf-m-row-gap-md--pf-v6-l-flex--RowGap
1rem
.pf-v6-l-flex.pf-m-row-gap-lg--pf-v6-l-flex--RowGap
1.5rem
.pf-v6-l-flex.pf-m-row-gap-xl--pf-v6-l-flex--RowGap
2rem
.pf-v6-l-flex.pf-m-row-gap-2xl--pf-v6-l-flex--RowGap
3rem
.pf-v6-l-flex.pf-m-row-gap-3xl--pf-v6-l-flex--RowGap
4rem
.pf-v6-l-flex.pf-m-row-gap-4xl--pf-v6-l-flex--RowGap
5rem
.pf-v6-l-flex:is(.pf-m-row-gap, .pf-m-row-gap-none, .pf-m-row-gap-xs, .pf-m-row-gap-sm, .pf-m-row-gap-md, .pf-m-row-gap-lg, .pf-m-row-gap-xl, .pf-m-row-gap-2xl, .pf-m-row-gap-3xl, .pf-m-row-gap-4xl) > *--pf-v6-l-flex--spacer--row
0
.pf-v6-l-flex.pf-m-column-gap--pf-v6-l-flex--ColumnGap
1rem
.pf-v6-l-flex.pf-m-column-gap-none--pf-v6-l-flex--ColumnGap
0
.pf-v6-l-flex.pf-m-column-gap-xs--pf-v6-l-flex--ColumnGap
0.25rem
.pf-v6-l-flex.pf-m-column-gap-sm--pf-v6-l-flex--ColumnGap
0.5rem
.pf-v6-l-flex.pf-m-column-gap-md--pf-v6-l-flex--ColumnGap
1rem
.pf-v6-l-flex.pf-m-column-gap-lg--pf-v6-l-flex--ColumnGap
1.5rem
.pf-v6-l-flex.pf-m-column-gap-xl--pf-v6-l-flex--ColumnGap
2rem
.pf-v6-l-flex.pf-m-column-gap-2xl--pf-v6-l-flex--ColumnGap
3rem
.pf-v6-l-flex.pf-m-column-gap-3xl--pf-v6-l-flex--ColumnGap
4rem
.pf-v6-l-flex.pf-m-column-gap-4xl--pf-v6-l-flex--ColumnGap
5rem
.pf-v6-l-flex:is(.pf-m-column-gap, .pf-m-column-gap-none, .pf-m-column-gap-xs, .pf-m-column-gap-sm, .pf-m-column-gap-md, .pf-m-column-gap-lg, .pf-m-column-gap-xl, .pf-m-column-gap-2xl, .pf-m-column-gap-3xl, .pf-m-column-gap-4xl) > *--pf-v6-l-flex--spacer--column
0