Ændre ul og li elementer.

Jeg vil gerne lave mine egne "prikker" til liste-elementer.
Indtil videre så fungerer dette i IE:

.ul {
  margin: 0px;
}

.li {
  background: url(li.gif) no-repeat 5px 50%;
  padding: 2px 10px 2px 20px;
}

men i f.eks. Firefox, så kan man stadig se de originale prikker sammen med mine egne (li.gif). Nogen forslag?
Desuden virker det som om margin: 0px; ikke fungerer i f.eks. Firefox (ved godt margin: 0px; fungerer, men i mit tilfælde har min liste ikke margen lig 0).