1

这当然是最容易用一些代码来展示的：

.container{
    .gallery {
        ul {
            @include clearfix;
        }
        li {
            @include span-columns(1,4);

            &:nth-child(4n) {
                @include omega;
            }
        }
    }

    @include at-breakpoint($large-columns) {
        .gallery {
            li {
                @include span-columns(1,3);

                &:nth-child(4n) {
                    @include remove-omega;
                }
                &:nth-child(3n) {
                    @include omega;
                }
            }
        }
    }
}

我从 4 列开始，第 4 列是 omega，然后我想改成 3 列，第 3 列是 omega。正确的元素正确地向左/向右浮动，但每 4 次得到一个错误的边距 - 右...

我这样做对吗？或者更确切地说，我做错了什么？

感谢阅读，/安迪

4

1 回答 1

3

您的问题具有误导性，因为我们不知道$large-columns. 我认为该值可能是59em 3-但效果很好。看起来价值实际上只是59em- 这导致了你的问题。

如果你设置一个没有列数的断点，Susy 会根据你的$column-width和$gutter-width设置计算一个新的上下文。这不会导致任何问题，span-columns(1,3)因为您使用显式的一 (3) 覆盖全局上下文。但remove-omega也需要知道上下文（为了应用排水沟）并且你不通过一个 - 所以它使用全局上下文。

你有两个选择：

  1. 您可以更改断点：at-breakpoint(59em 3)
  2. 您可以传递显式上下文：remove-omega(3).
于 2013-04-11T04:39:17.850 回答