Blazor Splitter
The Blazor Splitter divides an area into resizable, collapsible panes, horizontally or vertically.
Pane A1
50% Min 30px Max 70%
Pane A2
Pane B1
Size 50px Min 30px
Pane B2
Pane B3
not resizable
Pane B4
Min 10%
Pane B5
not collapsible
Pane B7
not resizable
Pane B8
Pane C1
collapse and resize programmatically disabled
Pane C2
collapse and resize programmatically disabled
Console log
Keyboard Navigation linkLink to this section
The following keys resize the panes when a resize bar is focused.
| Press this key | To do this |
|---|---|
| Tab | Move focus to the next resize bar or collapse/expand button. |
| Left or Right Arrow | Resize the panes of a horizontal Splitter. |
| Up or Down Arrow | Resize the panes of a vertical Splitter. |
| Home | Resize the pane to its minimum (smallest allowed) size. |
| End | Resize the pane to its maximum (largest allowed) size. |
| Enter or Space | Collapse or restore the focused pane (on the resize bar or the collapse/expand button). |
Frequently asked questions
How do I create resizable panes in Blazor?
Use RadzenSplitter with RadzenSplitterPane children; users drag the bars to resize, and panes can be collapsible.
Radzen Blazor Components, © 2018-2026 Radzen.
Source Code licensed under
MIT