List-Style-Image in IE

[$eric=me]

I'm trying to have my bulleted image square line up with the text in IE 6/7. It works beautifully in FF and Safari (surprise...surprise). Below is the class I'm using to apply the image to various ul/li's on the page

.services {
list-style-image: url(images/sqBullet.jpg);
display: block;
}

Suggestions?
Thanks!

[Fang]

Using a background image is usually easier to align
ul {list-style-type:none;}
li {
padding-left:20px; /* move text away from image */
background:url(mages/sqBullet.jpg) no-repeat 0 5px; /* use image position to align to text */
}

[WebJoel]

What do you mean 'line up with the text'?

Do you mean this:

.services {
list-style: url(images/sqBullet.jpg) inside;
display: block;
}

The 'background-position' of "inside" places the bullet 'inside' of the UL, as opposed to the default 'outside'. -A 20px-maybe difference. Note that 'combining declarations' (in this case, url(), and inside), you can drop the "-image" part of "list-style-image" because "inside" isn't 'image', it is 'position'.

And I am not sure if you need the "display:block;", -that would be default anyway, wouldn't it? It's declaring "inline" that would make this be a horizontal list..