强制列显示在较小宽度的屏幕上

Question

我正在编写一个显示在旋转显示屏（800x1280）上的仪表板，并希望使用Bootstrap来简化开发。当我使用列时，由于屏幕的宽度，它们最终会堆叠在一起。

尽管宽度减小，我怎么能像往常一样强制显示列？

编辑：

使用col-xs-*和col-sm-*会导致项目堆叠，这是我不想要的。

这是我的代码：

<!-- ... links to bootstrap etc. ... -->

<div class="container-fluid">
    <div class="col-sm-4">Column 1</div>
    <div class="col-sm-4">Column 2</div>
    <div class="col-sm-4">Column 3</div>
</div>

在此处试试：http://codepen.io/anon/pen/xRvXYV。打开Chrome的开发工具，打开设备工具栏，然后将大小设置为800x1280。列将堆叠。

Answer 1

好吧，我的部分愚蠢，来自Bootstrap的部分奇怪。

我需要将列包装成一行，但最重要的是，我需要使用文档声明的col-xs*用于设备＆lt; 768px宽。我的显示器绝对是800px宽，如果不是，绝对不会低于768px。

感谢Banzay对行的提示，但我仍然对col-xs-*轻描淡写。