Susy - 在流体容器中获得静态跨度宽度

Question

我正在使用 susy 流体网格容器构建网站。但是我的一些界面元素需要固定宽度。所以有这些设置：

$susy: (
  columns: 12,
  container: rem-calc(1680),
  gutters: 28px/112px,
  global-box-sizing: border-box,
  gutter-position: split
);

我想轻松获得例如 8 列跨度，但是是静态的。所以@include span(8 of 12) 会产生百分比值，这很好，但在某些情况下，我想获得静态值（当然基于容器固定的最大宽度）。

有可能吗？

Answer 1

是的 - 只要您设置了 column-width 或 container，您就可以将 static 作为参数传递给任何想要静态输出的 Susy 函数或 mixin — @include span(8 of 12 static)。 （不要同时设置，否则有可能发生冲突）

更新：哦，我看到上面的评论中提到了这一点......

Answer 2

你可以在上面的 susy 全局设置中添加：

math: static

但为了做到这一点，您还需要包含 column-width 对象。

假设您希望每列的宽度为 40px，使用您的示例如下所示：

$susy: (
  columns: 12,
  ...
  math: static,
  column-width: 40px
);

当您使用@include span 而不是使用 % 基础时，它将使用您希望它作为静态的 px 基础。