React

Stack

ExamplesPropsCSS Variables

Examples

Basic

content
pf-m-fill
content

With gutter

content
pf-m-fill
content

Props

Stack properties
NameTypeRequiredDefaultDescription
gutter'sm' | 'md' | 'lg'nullAdds space between children.
childrenReact.ReactNodenullcontent rendered inside the Stack layout
classNamestring''additional classes added to the Stack layout
componentReact.ReactNode'div'Sets the base component to render. defaults to div
StackItem properties
NameTypeRequiredDefaultDescription
isFilledbooleanfalseFlag indicating if this Stack Layout item should fill the available vertical space.
childrenReact.ReactNodenulladditional classes added to the Stack Layout Item
classNamestring''content rendered inside the Stack Layout Item

CSS Variables

--pf-l-stack--m-gutter--MarginBottoml_stack_m_gutter_MarginBottom
1.5rem
--pf-l-stack--m-gutter--md--MarginBottoml_stack_m_gutter_md_MarginBottom
1rem