Internet explorer 8 列出IE8中的项目内联块问题

我有一个水平色样列表，每个列表项都有以下标记：

<li class="ws-filter">
    <a class="ws-swatch-link" title="Black" href="#">
        <div title="Black" class="ws-filter-swatch" style="background-color: #000000;"></div>
    </a>
</li>

下面是JSFIDLE：

这在大多数浏览器中都可以正常工作，如下所示：

但是，在IE8中，选定的样例会弹出，如下所示：

.ws-filter div[title="Silver"] {
    margin-top: 20px\0/ /* or margin-bottom: -20px. The value here can changed based on your context */
} 

这是我正在处理的项目，我无法更改标记。我尝试过以不同的组合更改div、锚点和列表项的显示。我很确定我可以用float让它工作，但是有没有办法不用float解决这个问题呢？

试试看

vertical-align: middle;

---

我有一个强烈的预感，IE8的默认设置会将内容放在最上面。

既然你没有发布任何相关的CSS，我只能建议你使用IE黑客技术来瞄准IE8。在你的情况下，尝试以下方法：

.ws-filter div[title="Silver"] {
    margin-top: 20px\0/ /* or margin-bottom: -20px. The value here can changed based on your context */
} 

---

你知道IE8到底发生了什么吗？这是我尝试的第一件事，我知道我做到了…好吧，显然不是叹息…谢谢。我知道，有时候浏览器只是出于任何原因拒绝更新资源。就像我告诉自己的，我知道这不是我所期望的，点击刷新或者在极端情况下重新启动浏览器。对不起，我的意思是发布CSS和JSFIDLE链接-添加到问题中。

.ws-filter div[title="Silver"] {
    margin-top: 20px\0/ /* or margin-bottom: -20px. The value here can changed based on your context */
}