Visibility Classes

Foundation 3 allows you to easily turn elements on and off based on certain device criteria, like screen size, touch, or orientation.

Screen Size

The following text should describe the device you're using: You are on a very large screen. You are on a large screen. You are on a large or very large screen. You are on a medium screen. You are on a medium or small screen. You are on a small screen, like a smartphone.

This example uses the opposite rules, so the following text should inversely describe the device you're using: You are not on a very large screen. You are not on a large screen. You are not on a large or very large screen. You are not on a medium or small screen. You are not on a medium screen. You are not on a small screen.

Orientation Detection

The following text should describe the device you're using: You are in landscape orientation. You are in portrait orientation.

Touch Detection

The following text should describe the device you're using: You are on a touch-enabled device. You are not on a touch-enabled device.

Accordion

Publish

Publish Publish Publish Publish

Split Button