Stack

Examples

Basic

content
pf-m-fill
content

With gutter

content
pf-m-fill
content

Props

Stack

*required
NameTypeDefaultDescription
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
hasGutterbooleanfalseAdds space between children.

StackItem

*required
NameTypeDefaultDescription
childrenReact.ReactNodenulladditional classes added to the Stack Layout Item
classNamestring''content rendered inside the Stack Layout Item
isFilledbooleanfalseFlag indicating if this Stack Layout item should fill the available vertical space.

CSS variables

Expand or collapse columnSelectorVariableValue
:where(:root, .pf-v6-l-stack)--pf-v6-l-stack--m-gutter--Gap
1rem