List item bullets not showing

HTML & CSS
1

See www.nahidfashions.com/boutique
The white section under the page logo banner.

With the css code below I want my list items to display a graphic for the bullets.

I can’t figure out why they don’t show. If I remove the display:inline, the bullets show but the list is then centered and the list items don’t wrap.

I can I get the list items to display the bullets, but wrap as if I used a float:left or something. (I tried using it, but that just cause more problems :confused: ).

#navMain ul, #navSupp ul, #navCatTabs ul {
	margin: 0;
	padding: 0.5em 0em;
	/*list-style-type: none;*/
	text-align: center;
	line-height: 1em;}

#navMain ul li, #navSupp ul li, #navCatTabs ul li {
	display: inline;}

#navCatTabs ul li {padding-left: 0.7em; line-height: 1.5em; list-style-image:url(../images/flower-artistic.png);}


#navCatTabs ul li a:link, #navCatTabs ul li a:visited {
    color: #603;}
#navCatTabs ul li a:active, #navCatTabs ul li a:hover {
     color: #fc3;
     background-color: #603;
     text-decoration:none;}

Thanks for any help. I bet it’s something simple.

2

The padding-left of the unordered list is set to 0. That way the bullet is not shown if the bullet is positioned outside.

Grtz,
Vince

3

Inline display will normally hide the bullets, and list-style-image is buggy cross browser anyway. Best way would be to add a little more left padding to the <li> and set the image as a non-repeating background image to the <li>.

4

Thanks so much Centauri. Your help worked wonders.