Material Bootstrap Utilities Display

CSS for Display and Visibility

Display utility classes that apply to all breakpoints, from xs to xl, have no breakpoint abbreviation in them. This is because those classes are applied from min-width: 0; and up, and thus are not bound by a media query. The remaining breakpoints, however, do include a breakpoint abbreviation. As such, the classes are named using the format:

.d-{value} for xs.
.d-{breakpoint}-{value} for sm, md, lg, and xl.

none
inline
inline-block
block
table
table-cell
table-row
flex
inline-flex

Set the visibility of elements with our visibility utilities. These utility classes do not modify the display value at all and do not affect layout – .invisible elements still take up space in the page. Content will be hidden both visually and for assistive technology/screen reader users.

Apply .visible or .invisible as needed.