我目前正在从事一个使用 Foundation 6 的元素。 我有一个奇怪的问题，我的列垂直堆叠(它们都是屏幕的 100% 宽度)
我使用的非常简单的代码是这样的:
<div class="row">
<div class="small-2 large-4 columns"><!-- ... --></div>
<div class="small-4 large-4 columns"><!-- ... --></div>
<div class="small-6 large-4 columns"><!-- ... --></div>
</div>
这是直接从基金会网站上的基本网格示例复制而来的。我确定我已正确链接到样式表，因为即使我使用样式表的完整路径，这种情况也会继续发生。
<link rel="stylesheet" href="css/foundation.css">
<link rel="stylesheet" href="css/app.css">
提前感谢您的帮助!
最佳答案
这是因为最新版本的 Foundation 启用了 XY 网格，它不会调用类的 CSS “small-2 large-4 columns”!
如果您正在使用 SASS，只需将包含的参数设置为 false，但我假设您只是在使用 CSS，因此如果您只是重新下载自定义版本，然后只需选中“ float 网格”，它就会为您提供帮助回到旧的网格系统，您的代码应该可以工作!
如果您想了解有关新 XY 网格的更多信息，请访问以下链接:http://foundation.zurb.com/sites/docs/xy-grid.html
这是下载自定义基础版本的链接: https://foundation.zurb.com/sites/download/
希望这对您有所帮助!
关于html - Foundation 6 网格列始终为 100% 宽度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45734077/