Style UL with Sprite Image

Question

Wondering if it is possibly to use a sprite image to replace the ul list default bullet. Is this possible?

Answer 1

Lists have the list-style-image property, but it is often too inflexible.

You can usually get it working with something like this...

ul {
   list-style: none;
}

ul li {
   padding: 3px 0 3px 35px;
   background: url(images/layout/bullet.png) no-repeat left center;
}

A sprite is not generally a good idea for this - unless you space them all vertically and allow sufficiently enough vertical margins so the list item doesn't grow too large and have other sprites bleed through.

Answer 2

ya sure its possible

first you remove the bullet style for the li tag

list-style:none;

Then give background-image for the li tag