Hide on Desktop or Hide on Mobile

There are two special classes we have made available for the site:

  • class="hide-on-desktop"
  • class="hide-on-mobile"

As the names would suggest these can be used to create content that is only for desktop or mobile sized devices. You can apply the class using the Create Div Container button or you can add the CSS class in the source code (learn more about HTML).

You will not see the change in the editing interface. Only when viewing the page on the appropriately sized device will the content be hidden.

Improve Mobile Experience

Since content gets so narrow on mobile it may be useful to combine a jump link and the hide on desktop class.

Completely Visually Hidden

It’s very rare but there is a way to hide content from the visual display so that it is only displayed by text only devices.