The following CSS selectors can be used in stylesheets to target the various parts and states of the component.
- Root element
-
vaadin-split-layout
States
- Horizontal split
-
vaadin-split-layout[orientation="horizontal"]
- Vertical split
-
vaadin-split-layout[orientation="vertical"]
Parts
- Splitter bar
-
vaadin-split-layout::part(splitter)
- Splitter drag handle
-
vaadin-split-layout::part(handle)
- Splitter visual handle
-
vaadin-split-layout::part(handle)::after
- First content
-
vaadin-split-layout > [slot="primary"]
- Second content
-
vaadin-split-layout > [slot="secondary"]