Cacher is the code snippet organizer for pro developers

/* Some Imp classes of Bootstrap 3x*/

1] Visibilities devicewise Ref: http://getbootstrap.com/css/#responsive-utilities

a) Hidden Devices
=========================================
.hidden-xs , .hidden-sm , .hidden-md , .hidden-lg
===============================================================

Codes
=======
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

b) Visible Devices
==============================================================
.visible-xs , .visible-sm , .visible-md , .visible-lg
==============================================================

Codes
===========================

@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}

=======================================

Visible xs-block
================================

@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
==================================
Visible xs-display inline
================================
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}

===============================
Visible xs- display-inline-block
===============================

@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}

============================================
visible sm
==========================================
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}

========================================
Visible sm-block
======================================
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
==============================================
visible sm-inline
============================================
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
===========================================
visible sm inline-block
=============================================
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
===========================================
Visible md-
==========================================
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
====================================
visible md-block
======================================
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
==========================================
visible md-inline
========================================
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
=======================================
visible md-inline-block
======================================
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
======================================
visible-lg-
======================================
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
=========================================
visible-lg-block
=======================================
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
======================================
visible-lg-inline
=====================================
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
===================================
visible-lg-inline-block
===================================
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}