How can I reduce the bullet size of a list item?

HTML & CSS
1

I only managed to change the color and the fonts !

2

I’ve played with this a bit, and it seems the only way to do it consistently and cross browser is to use a bullet image (e.g. ul { list-style-image: url(foo.gif); } ).

3

You’ll need to do it with an image.

shrug

this is the code i usually use for it.

ul
{
font-size:12px;
list-style-type: none;
padding: 2px;
margin: 20px;
text-align: left;
color:#CCCCCC;
}

li
{
background-image: url(images/arrow.gif);
background-repeat: no-repeat;
background-position: 0 .25em;
padding-left: .8em;
}

4

Thank you I dit it and it work but know I’m trying to use an ordered-list with simple numbers on that same page and it keep my <li> parameters with the images.

div#contenu li {
display: list-item;
list-style-image: url(images/css/Line.gif);
list-style-type: none;
list-style-position: outside;
padding-top: 0px;
padding-left: 0px;
margin-left: -15px;
font-size: 11px;}

div#contenu ol li {
display: list-item;
list-style-type: decimal;
list-style-position: outside;
padding-top: 0px;
padding-left: 0px;
margin-left: -15px;
font-size: 11px;}