Display

properties

Class

Class Attribute
display--none display: none
display--block display: block
display--inline-block display: inline-block
display--inline display: inline
display--flex display: flex
display--inline-flex display: inline-flex

responsive

Our responsive classes take a mobile-first approach by either showing or hiding elements at specified viewports. The classes are broken down by using show or hide and applying a viewport suffix such as :tablet or :desktop.

Class

Class Result
show-print Show on printed media.
hide-print Hide on printed media.
show Show at all screen sizes.
show:tablet Show at our tablet breakpoint and up.
show:lg-tablet Show at our large tablet breakpoint and up.
show:laptop Show Show at our laptop breakpoint and up.
show:desktop Show at our desktop breakpoint and up.
hide Hide on all screen sizes.
hide:tablet Hide on our tablet breakpoint and up.
hide:lg-tablet Hide on our large tablet breakpoint and up.
hide:laptop Hide on our laptop breakpoint and up.
hide:desktop Hide on our desktop breakpoint and up.