html - 无论网格项的请求宽度如何，Foundation Grid 列都会占据整个宽度

Question

我使用的是 Foundation for Sites 版本 6.4.1，从版本 6.3.* 更新到此版本后，我的网格系统一团糟。我需要使用旧版 float 网格而不是他们在 6.4 中引入的新网格，但文档表明 6.4 应该充分向后兼容。

如果我有一行看起来像这样:

<div class="row">
  <div class="medium-8 medium-centered columns">
    Content
  </div>
</div>

中心栏将占据整个页面。我做错了什么？

Answer 1

请确保您使用的是正确的网格，Foundation 6.4 有 3 个网格可用:XY(默认)、 float 和 flex 。

您示例中的代码属于“传统” float 网格，而此新版本(从 6 月 27 日起)中的默认网格是 XY 网格。所以你有两个选择:

1. 根据新的 XY 网格更改您的标记(查看 http://foundation.zurb.com/sites/docs/xy-grid.html)
2. 更改框架以使用Float Grid，现在这取决于您首先下载框架的方式；如果你使用预编译包，你应该去http://foundation.zurb.com/sites/download.html/#customizeFoundation自定义(基本上只需选择 Float Grid 并下载一个新包)；如果您使用的是 SASS 版本，只需转到 _settings.scss 文件，找到变量以选择合适的网格并重建。

希望这对您有所帮助。