如何使用susy有效删除最后一列的边距?

Fla*_*vio 3 html css sass susy-compass susy-sass

我使用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>
Run Code Online (Sandbox Code Playgroud)

我希望"新闻"占据一整行,"推特"占据这一行的一半而"博客"占据另一半.这两个"摘录"应占据"博客"栏目的一半.因此,我有以下scss:

.news {
    @include container();
}
.tweet {
    @include span(6);
}
.blog {
    @include span(6 at 7);
}
.excerpt {
    @include span(3 of 6);
}
Run Code Online (Sandbox Code Playgroud)

当然,第二段摘录现在也有一个正确的排水沟,这使它跳上一条新线.因此,我认为我会使用该last标志作为:last-childSusy提供的摘录,但这不起作用.右边的排水沟已经设置好了@include span(3 of 6),因此会留下来.唯一能解决问题的方法就是删除正确的边距:

.excerpt:last-child {
    margin-right: 0;
}
Run Code Online (Sandbox Code Playgroud)

这有效,但我认为必须有另一种解决方案.在那儿?

pas*_*ine 6

我还没有尝试过Susy 2,所以请给我一个建议.使用旧版本的Susy,您可以使用omegamixin来指示最后一个元素.
在升级文档之后,这是他们对2.0版的建议:

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

// Susy 2.x
.new:last-child { @include omega; }  
Run Code Online (Sandbox Code Playgroud)

资源

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

.excerpt:last-child { @include last; } 
Run Code Online (Sandbox Code Playgroud)