Html css最后一个孩子不工作

我有一个新闻文章的网格，我想要它，所以网格中的最后两篇文章没有底部边框，但是我的css

last child

选择器似乎不起作用，类右侧的最后一篇文章去掉了边框，而类左侧的最后一篇文章没有，这有什么原因吗

这是我的一堆代码和问题

---

如上@BoltClock所述，将

broder底部

替换为

边框顶部

，并将目标对准

第一个孩子

。一些较旧的浏览器不支持

最后一个子项

：

JSFiddle：

编辑 好的，正如@BoltClock在下面的评论中提到的，问题不完全在于

最后一个孩子的问题。但是，如果您确实按照上面的建议使用了
边框顶部
，然后将直接跟随
第一个子项
的下一个
选择
元素作为目标，则可以从前两篇文章中删除
边框顶部

section:first-child .snippet, section:first-child + section .snippet {
    background:none;
    border-top:none;
}

jsfdle:
您可以通过使用第n个最后一个子（n）伪类来实现这一点。它从集合的末尾开始，这样您就可以在不知道集合大小的情况下指定最后两个元素。请在css代码中尝试此选择器：

.grid_9:nth-last-child(1) .snippet, .grid_9:nth-last-child(2) .snippet {
    background: none;
    border-bottom: none;
}

这是有用的css选择器的一个很好的参考
最后一个
。left
不是最上面的
div的最后一个子项，因此它不匹配。有什么方法可以将last.left和last.right作为目标吗？由于回溯限制，不使用css，但是如果您可以以某种方式将底部边框切换为顶部边框，如果你能用
：last child
，你就不能用
：nth last child
？它们对浏览器的支持程度几乎相同@thirtydot：这应该是可能的，但在某种程度上取决于
.left
和
.right
元素的结构。不过看起来值得一试。浏览器支持问题不是真正的原因，但无论如何，了解这一点很重要。