使用带有Susy的omega从4列更改为3列失败

Question

使用某些代码显示最简单：

.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列是欧米茄，然后我想改成3列，第3列是欧米茄。正确的元素是左/右正确浮动，但每4个都有一个错误的边距 - 右边......

我这样做了吗？或者说，我做错了什么？

感谢阅读， /安迪

Answer 1

您的问题具有误导性，因为我们不知道$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)。