HTML

Divider

ExamplesDocumentationCSS Variables

Examples

<hr>


<li>

  • List item one
  • List item two

<div>

Documentation

Overiew

The divider renders as an <hr> by default. It is possible to make the divider render as an li or a div to match the HTML5 specification and context of the divider.

AttributeApplied toOutcome
role="separator"li.pf-c-divider, div.pf-c-dividerIndicates that the separator is a separator.

Usage

ClassApplied toOutcome
.pf-c-divider<hr>, <li>, <div>Defines the divider component.

CSS Variables

--pf-c-divider--BackgroundColorc_divider_BackgroundColor
var(--pf-global--BorderColor--dark-100)
--pf-c-divider--Heightc_divider_Height
var(--pf-global--BorderWidth--sm)