Foundation 5 - 1170 网格计算不正确答案

【问题标题】：Foundation 5 - 1170 grid calculated incorrectlyFoundation 5 - 1170 网格计算不正确
【发布时间】：2014-05-28 08:20:47
【问题描述】：

我已经开始学习基础 5，并且我的应用程序使用 1170 网格、70 像素列和 30 像素装订线 (70 * 12 + 30 * 11 = 1170)。当我为我的基础 _settings.scss 文件输入默认值时：

$row-width: rem-calc(1170); $column-gutter: rem-calc(30); $total-columns: 12;

但不是有 70 像素宽度的列，而是单列的宽度为 97 像素。任何人都知道它是如何计算的，也许我错过了一些设置变量？提前致谢。

我发现，例如，在 Chome 中，它会生成一个 68px 的列，左右填充 15px。有什么方法可以让左右容器填充消失？

【问题讨论】：

确保您没有更改 '_settings.scss' 中的变量，然后重新注释它们并期望它们返回到它们的原始值。您需要使用原始值保存和编译 sass 至少一次，以便将它们重新设置。

【解决方案1】：

我已经解决了我的问题。

事实证明，基础 1170 网格实际上是一个 1200px 的网格，每列的两边都有 15px 的边距。考虑到我们希望为帧间距较低的分辨率保留外部边距，这实际上是个好主意。

所以解决方案是将 $row-width 设置为 1200。

【讨论】：

【解决方案2】：

我没有使用基础，但如果你愿意，你可以创建一个新的类来填充 0，例如：

  .nopadding {
    padding:0;
  }

我也认为设置 $collapse:true 可以解决问题。

【讨论】：