Flex 🚫 Table of Contents

• Props
• Slots

Propertiestype BreakpointCustomizable<T> = { base: T; xs?: T; s?: T; m?: T; l?: T; xl?: T; xxl?: T; };PropertyAttributeDescriptionTypeDefaultalignContent 🛠align-contentThis aligns a flex container's individual lines when there is extra space in the cross-axis, similar to how "justifyContent" aligns individual items along the main axis.type FlexAlignContent =
'stretch'
'flex-start'
'flex-end'
'center'
'space-between'
'space-around'
'space-evenly'
BreakpointCustomizable<FlexAlignContent>'stretch'alignItems 🛠align-itemsDefines how the flex items are aligned along the cross axis.type FlexAlignItems =
'stretch'
'flex-start'
'flex-end'
'center'
'baseline'
BreakpointCustomizable<FlexAlignItems>'stretch'direction 🛠directionDefines the direction of the main and cross axis. The default "row" defines the main axis as horizontal left to right.type FlexDirection =
'row'
'row-reverse'
'column'
'column-reverse'
BreakpointCustomizable<FlexDirection>'row'inline 🛠inlineDefines the flex containers content flow if 2 or more containers are siblings of each other.type FlexInline =
BreakpointCustomizable<FlexInline>falsejustifyContent 🛠justify-contentDefines how the flex items are aligned along the main axis.type FlexJustifyContent =
'flex-start'
'flex-end'
'center'
'space-between'
'space-around'
'space-evenly'
BreakpointCustomizable<FlexJustifyContent>'flex-start'wrap 🛠wrapHandles wrapping behaviour of elements.type FlexWrap =
'nowrap'
'wrap'
'wrap-reverse'
BreakpointCustomizable<FlexWrap>'nowrap'SlotsSlotDescriptionisRequiredaltPropallowedTagNames<slot> Default slot for the flex items.