文字の左側にチエックマークを入れる方法

よろしくお願いします。
文字の左側にチエックマークを入れたく以下の記述をしました。

【html】

<ul class="ulfont1">
<li>テストテスト11</li>
<li>ほげほげほげ</li>
</ul>


【css】

.ulfont1{
list-style-image:url(img/ani059.gif);
background-image:url(img/mark.png);
color: #ff0000;
font-weight:bolder;
font-size:1.0em;
line-height:2.0;
margin-left: -1px;
}


上記の内容をＩＥやfire foxのブラウザ上で見ると、表示されるのですがサーバー上で確認をしてみると、画像が・のようなマークで表示されてしまいます。
原因が分からないのですが、どなた様かご指導の程よろしくお願いします。

No.1 回答者： grumpy_the_dwarf 回答日時： 2009/07/27 10:18

> 文字の左側にチエックマークを入れたく

スタイルシートのlist-style-imageで指定した画像が見つからなけ
れば、list-style-typeで指定したマーカーが表示されます。大抵の
ブラウザで規定値はdiscだから、・みたいな感じですね。

チェックリスト
・サーバにimgフォルダとその中身を正しく転送したか。
・ファイル名の大文字小文字は間違いないか。

ローカルで見ている時にファイル名の大文字小文字が区別できない
環境があります。そこでは大文字小文字を間違えてても表示され
ちゃうので、サーバに転送してからビックリってのがあります。
油断大敵です。

No.2 ベストアンサー 回答者： noname#119957 回答日時： 2009/07/27 14:05

■画像を指定するなら以下の記述が必要では？

list-style-type: none;

**関連して**
■実は、リストの場合でもブレット画像は、他タグの場合と同じように背景画像で実現したほうが無難です。ブレット画像をＣＳＳで指定すると、ブラウザにより位置あわせが微妙に違い位置決めが不可能となります。
（ＩＥとｆｉｒｅｆｏｘで実際に統一できない）

■それで、以下のようにすると、ブレット画像の位置決めがブラウザによって変わることはなくなります。

<ul class="ulfont1">
<li>テストテスト11</li>
<li>ほげほげほげ</li>
</ul>

ulfont1{
color: #ff0000;
font-weight:bolder;
font-size:1.0em;
line-height:2.0;
list-style-type: none;
}
.ulfont1 li {
background: url(img/ani059.gif) no-repeat left center;
padding-left: 30px;
}