我在 ZURB 的论坛上发布了一个问题，但我注意到任何帖子都没有答案。
因为我认为这个问题可能会发生在许多其他人身上，所以我认为把它放在 SO 上也是一个好主意。它来了:
我使用以下标记制作了一个最小的问题示例(使用 CLCS 建议编辑):
<body>
<div class="row collapse test">
<div class="large-4 columns">
<p>Test 1</p>
</div>
<div class="large-4 columns">
<p>Test 2</p>
</div>
<div class="large-4 columns">
<p>Test 3</p>
</div>
</div>
</body>
所有 CSS 类都是 ZURB Foundation 未触及的类。唯一的添加是针对 test-table 类，其唯一目的只是为了获得问题的视觉帮助(为了清晰起见也进行了编辑):
.test div {
border: 1px solid red;
}
预期的输出将是 3 列完美地相互接触。实际输出是两列像预期的那样相互接触，但第三列在右侧稍微偏移，在中心和右侧之间留有空白(参见附图，也进行了编辑，但问题仍然存在)。
[编辑]似乎其他一些用户在相同的环境(Safari 7、Zurb Rails Gem 5.0.2.0)下也面临同样的问题[/编辑]
最佳答案
这是其他人在上面指出的舍入问题以及 Foundation 放置 float: right; 的事实的组合。在行的最后一列。这就是为什么您会看到最后一列和中间一列之间的差距。
要消除间隙，您可以添加 end类到每一列。
在“不完整的行”下查看 Foundation 的文档
http://foundation.zurb.com/docs/components/grid.html#incomplete-rows
关于zurb-foundation - ZURB 基础和行折叠，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20970347/