css - ul 元素中的文本和图标之间没有空格

Question

我对 ie7 和 ul 列表元素有一点问题。

在 ie8/9 和 firefox 中，图标和文本之间有一个额外的空白：

不幸的是，在 ie7 中，它看起来：

ul 列表的样式：

margin-top: 5px;
    list-style-image: url('../Images/listItem10.png');
    list-style-position: inside;
    padding-left: 5px; 
    font-weight: bold; 
    float: left;

不幸的是，任何为它创建黑客的尝试都行不通。请提供任何建议，我该如何实现它。

Answer 1

…………………………………………………………………………………………………………………………

嗨，现在不习惯background 图像list-style-image

margin-top: 5px;
    list-style:none;
background:url('../Images/listItem10.png') no-repeat 0 0;
    padding-left: 5px; 
    font-weight: bold; 
    float: left;

Answer 2

嗯..尝试将图像作为“背景图像”包含在

并添加一个填充

本身。现在填充将使

向右移动，因为它设置在 :

|
|...|#'Text'
|...|#'Text2'
|

将填充添加到

会使文本向右移动，而不是背景图像

|
||#...'Text'
||#...'Text'
|

也许这行得通:)（我希望“插图”能让您更好地了解我想说的话……：D）