网格列不在行中

Question

我是zurb基金会的新人。所以，我有一个安装了foundation-rails gem的rails应用程序。我正在测试基础文档中的一些示例代码。

这是我得到的：

<div class="row">
  <div class="small-2 large-4 columns test1">small2 large4</div>
  <div class="small-4 large-4 columns test1">small4 large4</div>
  <div class="small-6 large-4 columns test1">small6 large4</div>
</div>
<div class="row">
  <div class="large-3 columns test1">large-3 columns</div>
  <div class="large-6 columns test1">large-6 columns</div>
  <div class="large-3 columns test1">large-3 columns</div>
</div>

就像在文档中一样，我希望内部div排成一排（总共12列），但由于某种原因我得到这样的东西，内部div被叠加在一起。我添加了自定义css .test1给它一个轮廓，以便更容易看到边框的位置。我试过调整类，调整浏览器大小，但是列总是叠加为3行而不是一行。此屏幕截图是在浏览器视图最大化时拍摄的。

有什么见解？

更新（已解决）：

所以，确实我的ActieAdmin与基金会相冲突。环顾四周后，stackoverflow上的另一个线程给了我解决方案。

Rails Active Admin css conflicting with Twitter Bootstrap css

基本上只是将ActiveAdmin css文件（app / assets / stylesheets / active_admin.css.scss）移动到（vendor / assets / stylesheets / active_admin.css.scss）

修好了！