CSS帮助：在列表项中浮动图像会隐藏图标

我需要浮动列表项中的图像。在FF/6+中，一切看起来都很好。然而，Webkit和IE在图像顶部显示列表图标。当我尝试浮动列表项本身时，图标就会消失。有没有一种CSS方法可以解决这个问题？我尝试将内容包装在一个范围内，但仍然没有解决方案。为了减轻代码的负担，我删除了一些文本

<ul class="leftList">
<ul>
    <li>Pillow menu to customize your night's sleep</li>
    <li>Complimentary bathroom amenities</li>
    <li><span class="special_needs_list_item"><a rel="tooltip nofollow" title="Tooltip - Lorem ipsum"><img src="http://teamsite-prod.rccl.com:8030/DOT/img/global/special_needs.png" alt=""></a> Some srooms in this category are wheelchair-accessible.</span></li>
</ul>
</ul>


#ccStateroomFeatures ul {
    float: left;
    width: 320px;
    margin-left: 15px;
    font-size: 12px;
}
#ccStateroomFeatures ul li {
    margin-bottom: 5px;
}
#ccStateroomFeatures .leftList {
    width: 490px;
    float: left;
}

#ccStateroomFeatures .leftList ul,
#ccStateroomFeatures .rightList ul {
    float: none;
    margin-left: 15px;
    width: auto;
}
#ccStateroomFeatures .leftList ul .special_needs_list_item {
    margin:0 0 20px -15px;
    padding-left:15px;

}
#ccStateroomFeatures .leftList ul .special_needs_list_item img {
    float:left;
    margin:3px 5px 0 15px;
    overflow:hidden;
    width:13px;
}

---

我不确定我是否明白你想做什么。您是否试图使用提供的图像而不是列表图标

---

如果是这样，您将希望使用列表样式type:none来处理这个问题。然后利用边距让它按你想要的方式排列。

为什么要使用。leftList ul？您将这个类应用到ul的元素不是已经存在了吗？也许你的意思是ul.leftList。显然，我从代码中剪切了太多html，但我没有意识到ul在另一个ul中。这不是我的代码，它的格式很糟糕，我无法更改格式。然而，这是一个线索。不管出于什么原因，在一个LI中浮动一个元素似乎会把LI搞砸。我只是退了一步，幸运的是，这是一个足够小的图标，带有垂直对齐：顶部和负底部边距，它满足了我的需要。不，我不想用图像代替图标。列表有常规图标，我们需要在列表中插入图像，并将列表项中的文本环绕图像。所以它需要一个浮动。但当我浮动它时，它会在非Moz浏览器中破坏列表项的显示。