Reply To: [Solved] Media Queries issue

[TheDutchCoder]

Bootstrap doesn’t seem to have responsive show/hide classes, but you can create them yourself.

Example:

/* Mobile hiding/showing */
.hide-m {
  display: none;
}

.show-m {
  display: block;
}

/* Laptop hiding/showing */
@media screen and (min-width: 768px) {
  .hide-l {
    display: none;
  }

  .show-l {
    display: block;
  }

}

/* Desktop hiding/showing */
@media screen and (min-width: 992px) {
  .hide-d {
    display: none;
  }

  .show-d {
    display: block;
  }

}

Not sure if I’m using the right Bootstrap media queries, but you can alter them yourself ;-)

Then to show/hide a column you can do:
<div class="col hide-l show-d"></div>

Which will show the column on mobile, hide it on laptop and show it on desktop.