无论网格项的请求宽度如何,Foundation Grid列占据整个宽度

时间:2017-07-08 20:24:58

标签: html css zurb-foundation

我正在使用Foundation for Sites版本6.4.1,并且在从版本6.3。*更新到此版本时,我的网格系统搞砸了。我需要使用传统的浮动网格而不是6.4中引入的新网格,但是文档表明6.4应该是向后兼容的。

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



<div class="row">
  <div class="medium-8 medium-centered columns">
    Content
  </div>
</div>
&#13;
&#13;
&#13;

中间列将占据整个页面。我做错了什么?

1 个答案:

答案 0 :(得分:1)

请确保您使用正确的网格,Foundation 6.4有3个可用的网格:XY(默认),Float和Flex。

您的示例中的代码属于&#34;传统&#34; 浮动网格,而此新版本(从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文件,找到变量以选择正确的网格并重建。
  3. 希望这有帮助。