Twitter bootstrap 引导3中未水平显示的列

首先，我要说的是，我对这件事相当陌生

我试图让我的列水平显示，如下所示：

 first column                     second column

 first column
 second column

相反，他们的表现是这样的：

 first column                     second column

 first column
 second column

这是我的密码：

<div class="container">
    <div class="row">
         <div class="col-md-8">
             first column
         </div>
         <div class="col-md-4">
             second column
         </div>
    </div>
</div>

第一列
第二列

如果我用

span

替换

col md-

，使div类为

span8

和

span4

，则它工作正常。当然，我使用的是Bootstrap 3，所以我不应该使用span，但我觉得知道它很有趣。

您的语法是正确的

网格系统的预期功能是根据视口（浏览器屏幕宽度）进行包裹（垂直堆叠）。例如，使用

col md-

类，列将在992px或更大的视口中内联（水平）。任何小于992px的列都将换行

测试代码时，显示器或浏览器的宽度可能不大于992px。如果您没有正确使用

Respond.js

，IE8可能会出现同样的问题（无论视口如何）

如果您不想让它们换行，请尝试使用

列xs-

类

旁注：

span

元素是

inline

元素，

div

默认情况下是

block

元素，这就是它使用span的原因

---

编辑：我一开始误解了你的问题（关于

span

类的部分）<代码>span4类仅存在于bootstrap 2.x中，因此您的项目中必须包含错误版本的bootstrap。检查引导CSS文件，确保使用的版本正确。

Odd。我（清楚地）看到它在您的JSFIDLE中工作，但我无法让它在我的代码中工作，使用完全相同的语法。可能是因为我实际上是Ruby on Rails中的

application.html.erb

布局，但是，嗯。尽管我可能无法使这两列水平显示。@arigold请查看我上面的编辑，您一定使用了错误的引导版本。事实上，这是错误的版本。我错误地认为9天前编写的github回购协议是最新的。了解如何将引导3正确集成到Rails 4中。感谢@Schmalzy为我解答了这个问题。