Bootstrap 3网格布局没有响应

Question

我正在使用Bootstrap 3来设计布局并使用网格类来进行布局。我在下面的代码片段中提到了布局：

<div class=”container”>
  <div class=”row”>
    <div class=”col-sm-1 col-md-4 col-lg-3”>
      [ Metro Tiles content ]
    </div>
    <div class=”col-sm-11 col-md-8 col-lg-9”>
      [ Jquery Slider content ]
    </div>
  </div>
</div>

截图：

当我尝试在平板电脑或移动设备中打开该页面或使页面变小时，它的行为不响应。滑块未堆叠在图块布局下方。

任何人都可以指导我解决问题吗？

Answer 1

要使瓷砖堆叠在small设备上的滑块顶部，您应该使用：

<div class="container">
  <div class="row">
    <div class="col-sm-12 col-md-4 col-lg-3">
      [ Metro Tiles content ]
    </div>
    <div class="col-sm-12 col-md-8 col-lg-9">
      [ Jquery Slider content ]
    </div>
  </div>
</div>

Answer 2

似乎在这里工作正常：http://www.bootply.com/YgFqC17pgF

<div class="container">
  <div class="row">
    <div class="col-sm-1 col-md-4 col-lg-3 bg-info">
      [ Metro Tiles content ]
    </div>
    <div class="col-sm-11 col-md-8 col-lg-9 bg-success">
      [ Jquery Slider content ]
    </div>
  </div>
</div>