Susy 2 画廊和排水沟答案

【问题标题】：Susy 2 Gallery and GutterSusy 2 画廊和排水沟
【发布时间】：2016-02-07 12:42:22
【问题描述】：

我正在使用 Susy 2 Gallery 功能，想知道如何影响画廊中每个图像之间的垂直和水平间距的宽度。

目前，图片之间的宽度不够。

【问题讨论】：

【解决方案1】：

水平间距由$susy 映射中的gutters 设置控制。它们被设置为列宽的一部分。 See the docs。垂直排水沟由您手动处理。根据需要添加垂直边距。如果您希望它们与水平排水沟匹配，您可以使用 Susy gutter() 函数（例如 margin-bottom: gutter();）。

【讨论】：

我可以看到 margin-bottom: gutter();有效，但如果我添加 margin-left|right: gutter(...)，生成的 CSS 会被 Gallery 生成的样式删除。也许我遗漏了一些非常明显的东西，但我似乎无法控制画廊项目之间的垂直空间。
如果margin-bottom: gutter(); 有效，我不明白你的问题。请在 codepen 或 sassmeister 上展示演示。

【解决方案2】：

你可以这样做：

@include gallery(2 of 12 split);
margin-bottom: gutter(); // the same as gutter(12)

在图像之间分割装订线，并为底部装订线提供两个分割装订线的宽度。

【讨论】：