我如何使用css的最后一个孩子？

我有一个注释列表，我想使用一些css代码注释div设置最后一个子元素的

边界半径


我正在使用这个代码，但它不起作用

 #comments>.comment:last-child, .indented>.comment:last-child{border-bottom-right-radius: 5px;}

当与jquery一起使用时，它可以这样工作

 $('#comments>.comment:last, .indented>.comment:last').css('border-bottom-right-radius', '10px');

但是我想用css代码来解决这个问题。有什么建议吗

fiddle for simple code
您的HTML结构存在缺陷，因此替代解决方案是在希望右下角圆角的位置添加
右下角圆角
类

.right_bottom_round {
  border-bottom-right-radius: 5px !important;
}

并检查
我已经能够使用以下CSS代码使其工作（对于提供的HTML结构）：

#comments > .comment:nth-last-child(-n+2),
.indented > .comment:nth-last-child(-n+2) {
    border-bottom-right-radius: 15px;
}

现场演示：

因此，我们不是使用
：last child
来选择最后一个子项，而是使用
：nth last child（-n+2）
来选择最后两个子项。如果最后一个子元素是
.indented
DIV，则此选项有效，因为我们的
.comment
选择器将过滤掉它。但是，如果最后两个孩子都是
.comment
div，CSS样式将应用于这两个孩子，这会导致我不知道如何解决这个问题。
我在safari和Firefox上都检查了它，你想解决什么问题？你想要的最终结果是什么？我想创建一个类似的图片，但根据我的css代码，只有最后一个div有边框半径，而2个大写字母没有边框半径，就像Fiddle中的示例一样。你的HTML结构有缺陷。您应该使用UL/LI元素。哪个元素应该具有边界半径？
.comment
，
.meta
，完全是另一个元素？
！重要信息
应该是不必要的。不起作用，我可以编写错误的css来选择元素吗？simple fiddle@Farnabaz我试了很多次，但你的html中有问题，如前所述，所以我已经更新了替代方法，非常感谢，它的工作很好，我解决了这个问题，这里是最终的解决方案