Visibility examples
Current breakpoint
Using the responsive visibility classes, the active breakpoint is shown in green below. Resize your device to see this change.
Extra Small
Active breakpoint
Extra Small
Small
Active breakpoint
Small
Medium
Active breakpoint
Medium
Large
Active breakpoint Large
Extra Large
Active breakpoint
Extra Large
Full HD
Active breakpoint
Full HD
Visible classes
The table below shows which .bsk-visible- classes are visible at each responsive breakpoint. Visible combinations are
shown in green. The active breakpoint is also indicated in the table header.
| Extra Small Active breakpoint Extra Small | Small Active breakpoint Small | Medium Active breakpoint Medium | Large Active breakpoint Large | Extra Large Active breakpoint Extra Large | Full HD Active breakpoint Full HD | |
|---|---|---|---|---|---|---|
.visible-xs-* |
Visible | Hidden | Hidden | Hidden | Hidden | Hidden |
.visible-sm-* |
Hidden | Visible | Hidden | Hidden | Hidden | Hidden |
.visible-md-* |
Hidden | Hidden | Visible | Hidden | Hidden | Hidden |
.visible-lg-* |
Hidden | Hidden | Hidden | Visible | Hidden | Hidden |
.visible-xl-* |
Hidden | Hidden | Hidden | Hidden | Visible | Hidden |
.visible-fhd-* |
Hidden | Hidden | Hidden | Hidden | Hidden | Visible |
Hidden classes
The table below shows which .bsk-hidden- classes are hidden at each responsive breakpoint. Hidden combinations are
shown in green. The active breakpoint is also indicated in the table header.
| Extra Small Active breakpoint Extra Small | Small Active breakpoint Small | Medium Active breakpoint Medium | Large Active breakpoint Large | Extra Large Active breakpoint Extra Large | Full HD Active breakpoint Full HD | |
|---|---|---|---|---|---|---|
.hidden-xs |
Hidden | Visible | Visible | Visible | Visible | Visible |
.hidden-sm |
Visible | Hidden | Visible | Visible | Visible | Visible |
.hidden-md |
Visible | Visible | Hidden | Visible | Visible | Visible |
.hidden-lg |
Visible | Visible | Visible | Hidden | Visible | Visible |
.hidden-xl |
Visible | Visible | Visible | Visible | Hidden | Visible |
.hidden-fhd |
Visible | Visible | Visible | Visible | Visible | Hidden |