Html 断点中隐藏和可见的引导

我在使用第三版引导程序时遇到问题：

我的网站有两个主要部分，左边的侧栏（蓝色）和右边的主要内容（红色）。我希望侧边栏在992px和更高版本中不可见。我使用了底层代码，但仅在767px和991px（断点）中，它无法正常工作：(

如果你考虑Bootstrap V4，你会发现TaveLoad正好符合这个需要，参见V3，可能会有帮助。
<div 
  class="col-lg-4 col-md-4 hidden-sm hidden-xs sidebar" 
  style="height:200px ; background:blue">
</div>

<div
  class="col-lg-8 col-md-8 col-sm-12 col-xs-12 main"
  style="height:200px; background:red">
</div>