Display

Use shorthand display utility classes to quickly change an element's display value.

Notation

Display utility classes can be defined using the format -d-{breakpoint}--{value}. Breakpoints supported are sm, md, lg, and xl.

Target all breakpoints

Display utility classes with no breakpoint defined apply to all screen sizes.

Target specific breakpoints

To target a specific breakpoint, add the breakpoint abbreviation to the class. As a mobile first framework, it will apply to that specific breakpoint and up.

Special display classes

To target screen readers only or a specific media type (@media screen or @media print), use the below classes.