Patternfly Logo

Examples

Basic

content
pf-m-fill
content

With gutter

content
pf-m-fill
content

Props

Split properties
NameTypeRequiredDefaultDescription
childrenReact.ReactNodeNonullcontent rendered inside the Split layout
classNamestringNo''additional classes added to the Split layout
componentReact.ReactNodeNo'div'Sets the base component to render. defaults to div
hasGutterbooleanNofalseAdds space between children.
SplitItem properties
NameTypeRequiredDefaultDescription
childrenReact.ReactNodeNonullcontent rendered inside the Split Layout Item
classNamestringNo''additional classes added to the Split Layout Item
isFilledbooleanNofalseFlag indicating if this Split Layout item should fill the available horizontal space.

CSS variables

.pf-l-split--pf-l-split--m-gutter--MarginRight
1rem

View source on GitHub