How to change list items <li> to image?

Question

Hello,

I want to change the bullet of list items in Categories tab into image.

tried this css style [code='css']list-style:square url("sqpurple.gif");[/code]  in .qa-nav-sub-list {

at qa-styles.css but dont see changes, was i correct?

Thank you

Answer 1

If you want to use image as a bullets. I would suggest you to use background for li otherwise it may gives you some problem with positioning for cross browser.

You can use something like below

 

ul{

list-style:none;

}

ul li{

padding-left:20px /* assuming your image is 16px */

background:url(bullet-image-path)no-repeat left top /* if position top not align properly than you can define some pixel like 4px or so

}