Html css:n子项随机跳过列表项

我在这里张贴后，试图解决我自己的问题了几天。我有一个无序列表，其列表项包含多个内容，包括一个用于显示来自精灵的图像的div

以下是html：

<ul class="upperList clearfix">
            <li>
                <h3>Kit détecteur extérieur images</h3>
                <p></p>
                <div class="extrasLiBg"></div>
                <p class="description">Lorem ipsum dolor sit amet, consectetur adipisicing
                elit, sed do eiusmod tempor incididunt ut labore et dolore magna
                aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
                laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
                in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa
                qui officia deserunt mollit anim id est laborum.</p>
            </li>
            <li>
                <h3>Bouton anti hold-up avec capture d'images</h3>
                <div class="extrasLiBg"></div>
            </li>
            <li>
                <h3>Pendentif Verisure [me]</h3>
                <div class="extrasLiBg"></div>
            </li>
        </ul>

我的问题是，最后一个列表项中的div以某种方式拒绝移动背景图像，从而在精灵中显示第一个左上角的图像。。。 这让我抓狂，页面上还有其他列表，他们的div显示精灵的正确部分没有问题

我使用的是Chrome10BTW，但问题仍然存在于Firefox、Safari和Opera（最新版本）

---

谢谢您的帮助。

在第三个孩子的选择器中，将

.upperlist

更改为

。upperlist

在第三个孩子的选择器中，将

.upperlist

更改为

。upperlist

您能在类似的地方或您自己的服务器上在线演示吗？如果没有你的精灵图像，这有点难以想象。你能在网上或者你自己的服务器上放一个演示吗？如果没有你的精灵形象，这有点难以想象。

    .extrasLiBg {
    width:100px;
    height:100px;
    position:absolute;
    bottom:0;
    right:0;
    overflow:hidden;
    background:url('images/extras-sprite.jpg') no-repeat;
}

.extras .upperList li:nth-child(2) .extrasLiBg {background-position:-100px 0;}
.extras .upperlist li:nth-child(3) .extrasLiBg {background-position:-200px 0;}