如何在某些断点覆盖 Susy 设置

Question

我在一个小断点处使用 Susy 的画廊设置，并且（由于移动优先的 CSS 结构），它被传递到更大的断点，我不知道如何清除/覆盖它以允许我的 div 跨越全宽。

平板输出：

[div] [div] [div]

所需的桌面输出：

[      div      ]
[      div      ]
[      div      ]

我的尝试：

div {
  @include gallery(4);
  @media (min-width: 900px) {
    @include break;
    @include full;
  }
}

see FIDDLE

Answer 1

我确定你现在已经解决了这个问题，但是由于我遇到了同样的问题，我想我会发布我的解决方案。

添加以下混合：

@mixin reset-gallery {
  &:nth-child(1n) {
    margin-left: 0;
    margin-right: gutter();
  }

  &:last-child {
    margin-right: 0;
  }
}

然后按如下方式重置您的 div：

@media (min-width: 900px) {
  @include reset-gallery;
  @include span(full);
}

Updated fiddle here。它可能不适用于所有情况，但它对我有用，而且似乎也适用于你的情况。