Bootstrap 4 updated visibility classes

The hidden-* and visible-* classes no longer exist in Bootstrap 4. If you want to hide an element, use the d-* display classes accordingly.

hidden-xs-down = d-none d-sm-block hidden-sm-down = d-none d-md-block hidden-md-down = d-none d-lg-block hidden-lg-down = d-none d-xl-block hidden-xl-down = d-none (same as hidden) hidden-xs-up = d-none (same as hidden) hidden-sm-up = d-sm-none hidden-md-up = d-md-none hidden-lg-up = d-lg-none hidden-xl-up = d-xl-none hidden-xs (only) = d-none d-sm-block (same as hidden-xs-down) hidden-sm (only) = d-block d-sm-none d-md-block hidden-md (only) = d-block d-md-none d-lg-block hidden-lg (only) = d-block d-lg-none d-xl-block hidden-xl (only) = d-block d-xl-none visible-xs (only) = d-block d-sm-none visible-sm (only) = d-none d-sm-block d-md-none visible-md (only) = d-none d-md-block d-lg-none visible-lg (only) = d-none d-lg-block d-xl-none visible-xl (only) = d-none d-xl-block

Explore our projects