Dividers are a quick built in way to separate sections of content.

Example


Example


rc.vstack(
    rc.text("Example"),
    rc.divider(border_color="black"),
    rc.text("Example"),
    rc.divider(variant="dashed", border_color="black"),
    width="100%",
)

If the vertical orientation is used, make sure that the parent component is assigned a height.


rc.center(
    rc.divider(
        orientation="vertical", border_color="black"
    ),
    height="4em",
)

rc.Divider

Dividers are used to visually separate content in a list or group.

PropType | ValuesDefault
orientation
"horizontal" | "vertical"
variant
"solid" | "dashed"

Event Triggers

See the full list of default event triggers