Level
Use a Level layout to evenly distribute content horizontally within a container.
ExamplesPropsCSS VariablesExamples
Basic
Level Item
Level Item
Level Item
With gutters
Level Item
Level Item
Level Item
Props
Level properties| Name | Type | Required | Default | Description |
|---|
| hasGutter | boolean | No | | Adds space between children. |
| className | string | No | '' | additional classes added to the Level layout |
| children | React.ReactNode | No | null | content rendered inside the Level layout |
LevelItem properties| Name | Type | Required | Default | Description |
|---|
| children | React.ReactNode | No | null | content rendered inside the Level Layout Item |
CSS Variables
| | | | |
|---|
| .pf-l-level | --pf-l-level--m-gutter--MarginRight | | |
--pf-l-level--m-gutter--MarginRight |