Display
Basic Display
The following display utilities classes will set display property of an element.
| Class | Description |
|---|---|
.d-inline |
Set an inline display property of an element. |
.d-inline-block |
Set an inline-block display property of an element. |
.d-block |
Set a block display property of an element. |
Hiding Elements
For faster mobile-friendly development, use responsive display classes for showing and hiding elements by device.
| Class | Screen Size |
|---|---|
.d-none |
Hidden on all |
.d-none .d-sm-block |
Hidden only on xs |
.d-sm-none .d-md-block |
Hidden only on sm |
.d-md-none .d-lg-block |
Hidden only on md |
.d-lg-none .d-xl-block |
Hidden only on lg |
.d-xl-none .d-xxl-block |
Hidden only on xl |
.d-xxl-none |
Hidden only on xxl |
.d-block |
Visible on all |
.d-block .d-sm-none |
Visible only on xs |
.d-none .d-sm-block .d-md-none |
Visible only on sm |
.d-none .d-md-block .d-lg-none |
Visible only on md |
.d-none .d-lg-block .d-xl-none |
Visible only on lg |
.d-none .d-xl-block .d-xxl-none |
Visible only on xl |
.d-none .d-xxl-block |
Visible only on xxl |
