1

通过 CodeKit 使用 Susy，我遇到了一个奇怪的情况：

如果我使用：

.example { @include span (first); }

或者

.example { @include span (last); }

根据文件，Susy 按预期工作。但是，当使用例如

.example { @include span (4 at 5 of 12); }

制作了一个4列的盒子，但它没有放在第5列，而只是向左浮动。

但是，当使用例如 .example { @include span (3 at 8 of 12); }

正如预期的那样，该框是 3 列，但开始向右浮动，而不是在第 8 列中。换句话说，将元素放在某个列中不起作用。用简单的 margin-left 替换 susy mixin 效果很好，但这不是使用像 Susy 这样的网格系统的目的。

我已经联系了 CodeKit 的开发者，但他不认为 Susy 是 CodeKit 的问题。我已经使用一些在线课程的代码对其进行了测试，但它仍然可以正常工作。

这会是什么？使用 Susy 将元素放置在某个列中是否有任何先决条件？我在这里想念什么吗？

4

1 回答 1

3

at关键字用于隔离输出。如果需要，您可以全局打开隔离，但它会给输出增加一些体积，并改变元素在布局中的流动方式。如果没有隔离，Susy 无法了解您的 DOM 树，或者元素在默认流中的位置，或者如何将其来回推送到位 - 因此您需要明确设置与默认值相关的内容，使用边距混合（前/后/推/拉）。

[at也用于不对称网格，但在这种情况下它解决了不同的问题。]

于 2014-06-22T20:23:34.450 回答