Skip to content

Instantly share code, notes, and snippets.

@vickyRuiz
Created May 14, 2014 15:19
Show Gist options
  • Save vickyRuiz/1c180e37bff3d49a17ba to your computer and use it in GitHub Desktop.
Save vickyRuiz/1c180e37bff3d49a17ba to your computer and use it in GitHub Desktop.
CSS: Bootstrap - additional classes
/* GENERIC CLASSES */
@media (max-width: 480px) {
.mini-hide {display: none;}
.mini-show {display: block !important;}
a .mini-show {display: inline !important;}
.lg-less-hide, .md-less-hide, .sm-less-hide, .xs-less-hide {display: none;}
}
@media (max-width: 767px) {
.xs-show {display: block;}
.xs-hide {display: none;}
.lg-less-hide, .md-less-hide, .sm-less-hide, .xs-less-hide {display: none;}
.home_flag img {width: 75%; margin: auto;}
}
@media (min-width: 768px) and (max-width: 992px) {
.sm-hide {display: none;}
.sm-show {display:block;}
.lg-less-hide, .md-less-hide, .sm-less-hide {display: none;}
.xs-more-hide, .sm-more-hide {display: none;}
}
@media (min-width: 992px ) and (max-width: 1200px) {
.md-hide {display: none;}
.md-show {display: block;}
.lg-less-hide, .md-less-hide {display: none;}
.xs-more-hide, .sm-more-hide, md-more-hide {display: none;}
}
@media (min-width: 1200px) {
.lg-hide {display: none;}
.lg-show {display: block;}
.lg-less-hide {display: none;}
.xs-more-hide, .sm-more-hide, md-more-hide {display: none;}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment