CSS3 PIE 与 :first-child 冲突

Question

我正在使用 CSS3 PIE 向 IE8 及更早版本添加对 border-radius 的支持，它是与 :first-child 选择器冲突。

基本上，我有三个列表项向左浮动。每个都有 10px 的左边距，第一个除外，我将其设置为 0：

#steps li {
    border-radius: 10px;
    float: left;
    margin-left: 10px;
}
#steps li:first-child {
    margin-left: 0;
}

当我将 PIE 应用于 #steps li 选择器以添加对 border-radius 的支持时，第一个列表项重新绘制，左边距设置回 10px，就好像 #steps li:first-child 选择器不存在一样。我可以看出这是由于 PIE 重绘了元素，因为它在正确的位置短暂闪烁，然后瞬间移动了 10 像素以上。

我尝试过将 PIE 应用于两个选择器，但这并没有什么区别，而且我无法在 PIE 支持论坛上找到与第一个子级相关的任何内容。

Answer 1

查看官方论坛 CSS3 PIE 论坛 - IE :first/ last-child overwriting

最终的结果是你需要添加

#steps css3-container:first-child + li, 
#steps li:first-child {
    margin-left: 0;
}