Hide on Desktop or Hide on Mobile – College of Fine Arts Drupal Instruction

Last Updated November 2024

The following is rather advanced so please contact the web team for assistance.

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 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.