html - 如何使用susy有效地删除最后一列的边距？

我使用 susy 制作一个简单的 12 列网格。我想我已经或多或少地弄清楚了，除了一件事。我有以下标记:

<div class="news">
    <div class="tweet">
        <p>the tweet<p/>
    </div>
    <div class="blog">
        <h3>Recent News</h3>
        <div class="excerpt">
            <p>the excerpt<p/>
        </div>
        <div class="excerpt">
            <p>the excerpt<p/>
        </div>
    </div>
</div>

我希望“新闻”占据一整排，“推文”占据这一行的一半，“博客”占据另一半。这两个“摘录”应该占“博客”栏的一半。因此，我有以下 scss:

.news {
    @include container();
}
.tweet {
    @include span(6);
}
.blog {
    @include span(6 at 7);
}
.excerpt {
    @include span(3 of 6);
}

当然，第二个摘录现在也有一个正确的装订线，这使它跳到新的一行。所以我想我会使用 last 标志作为 susy 提供的摘录的 :last-child ，但这不起作用。 @include span(3 of 6) 已经设置了右侧装订线，因此将保留。唯一能解决问题的是删除右边距，如下所示:

.excerpt:last-child {
    margin-right: 0;
}

这有效，但我认为必须有另一种解决方案。有没有？

最佳答案

我还没有尝试过 Susy 2，所以请采纳这个建议。
在旧版本的 Susy 中，你有 omega mixin 来指示最后一个元素。
按照升级文档，这是他们对 2.0 版的建议:

// Susy 1.x
.old { @include nth-omega(last); }

// Susy 2.x
.new:last-child { @include omega; }

Source

更新
我意识到在 Susy 2.x 中 omega 已被 last 取代。
所以我认为你的问题的正确答案是

.excerpt:last-child { @include last; }

关于html - 如何使用susy有效地删除最后一列的边距？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22577846/