Divider

A preformatted control that combines a text label and a horizontal rule that can be used to separate sections of a list as a section header.

Behaviours & States

Behaviour

Dividers are comprised of a label and a horizontal rule. It is a Non-actionable control. Usage of the Divider determines if the label can be customized. For example, in Expandable Controls the Divider label is automatically set as the title of the Expandable Control. In a List the Divider label can be manually set.

 

When a Divider is used in conjunction with a scrolling List, the Divider can either scroll with the content, or can remain static with content scrolling beneath.

Sizing

By default, the horizontal rule will extend to the full width of the container.

 

The Divider label can extend to the end of the horizontal rule and will truncate with an ellipsis and marquee (scroll) continually.

Illustration

DIVIDER.png

Navigation