A divider is a thin line that groups content in lists and layouts.

Dividers separate content into clear groups.

List Dividers

The divider renders as a <hr> by default. You can save rendering this DOM element by using the divider property on the ListItem component.

Inset Dividers

The following example demonstrates the inset property. We need to make sure the Divider is rendered as a li to match the HTML5 specification. The example shows two ways of achieving this.

  • Photos

    Jan 9, 2014

  • Work

    Jan 7, 2014

  • Vacation

    July 20, 2014