避免使用span列为:last child设置右边距

Question

给定HTML:

<div class="parent">
    <div class="element"></div>
    <div class="other"></div>
</div>

这个萨斯：

.parent {
  .element {
        @include span-columns(2.5 of 8);
  }
}

它生成CSS:

.parent .element {
  float: left;
  display: block;
  margin-right: 3.22581%;
  width: 29.03226%;
}
.parent .element:last-child {
  margin-right: 0;
}

带有:last-child的部分困扰着我，因为它覆盖了我想要保留的带有right-margin的第一条规则。如何阻止Neat添加:last-child规则？或者，我应该做什么变通方法来设置我想要的右边距？

Answer 1

我觉得你在这里还好。Neat的span-columns() mixin通过使用上面复制的类将元素建立为列来工作，包括列之间的边沟的右边距。然后，它使用:last-child伪类删除最后一列上的空白页边距，这样就不会有不必要的空间。

考虑到这一点，示例中的.elementdiv不是:last-child，因此特定div的右边距将不受影响。我把这个扔在一个JSBin里，向你展示：http://jsbin.com/wawopef/edit?html，css，输出。我也把.other作为一个专栏，因为很明显你打算把它作为一个。那么，.elementdiv仍然有其余量。

如果你真的想重写规则，你可以通过重写mixin来实现，但A）这可能不是你想做的，B）这是使用其他人的网格框架的一部分。如果我们遵循他们的文档，它应该可以正常工作。或者框架不好，幸运的是波旁和尼特没有！