sass - 使用 Susy 的静态嵌套网格

Question

我正在用 Susy 试验静态布局，我需要一些关于如何建立具有相同排水沟宽度的嵌套网格的指导。在下面的示例中，我的 .main 跨越 12 列中的 9 列，我希望通过保持相同的 18px 间距宽度使其子 .main-item 在 9 列布局内具有四列布局。

这当然可以在流体网格中无缝工作，因为一切都是百分比，但在这个实验中，我想尝试使用静态网格。

做这个的最好方式是什么？“with-layout” mixin 是否只是通过定义新布局来实现这一目标的可能解决方案，还是有其他方法可以实现这一目标？

到目前为止我所尝试的： 1. 简单地提到 .main-item 的 span(3 of 12) 知道它不起作用，但仍然试了一下 2. 定义新布局并使用 with-layout mixin，但它让我失望此错误“函数有效列数学在没有@return 的情况下完成”。我想我会做错的。

感谢您的建议。

score 0 · Accepted Answer

重新定义网格需要大量额外的数学运算，因为您必须计算列的新大小。此外，上下文无关紧要，因为数学与上下文无关。不过，如果您只跨越小数列，它似乎可以工作。您想将 9 列分成 4 列，这样看起来像：

.main-item {
  @include span(9/4);
  &.last{
    @include last;
  }
}

1 回答 1