text-indentが効かない。。。

こんにちわ。みなさまのアドバイスにいつも助けられ感謝の毎日ですが、またしても困ってしまったのでご助言いただければ幸いです。

HTMLのヘッダー部に「お問い合わせ」や「アクセス」などの小さなナビゲーションを作り、CSSで以下のように定義しました。

.tnavi　　　{width: 285px;height: 31px; margin:0 0 0 60px; list-style: none; }
.tnavi li　　{float:left; margin-right:2px; text-indent:-9999px;}
.tnavi li a　{width:93px; height:31px; display:block;}

表示はgif画像を出すつもりなのですが、画像の上に思い切り「お問い合わせ」や「アクセス」とリンクテキストが表示されています。aタグ側にもとりあえず定義してみましたが変わりありません。
他に確認すべき項目ありますか？

No.1 ベストアンサー 回答者： naokita 回答日時： 2010/11/18 14:14

あまりお勧めしないけど、

背景画像上のテキストをネガティブインデントさせるって事。


/* CSS */
.tnavi li a { display: block; width: 93px; height: 31px;
background: url(画像.jpg) no-repeat; overflow: hidden;
text-indent: -9999px; }

<!-- HTML -->
<li><a href="URL">お問い合わせ</a></li>

この回答への補足

すいません！解決しました。
とっても恥ずかしいことしてました。。。当該リストを括っているdivタグにtext-align:rightが適用されてました。だから-9999px意味なかったんですね。。。
ごめんなさい。

補足日時：2010/11/18 16:04

この回答へのお礼

お返事ありがとうございます！
最後の手段としてトライしてみます。
気になるのは、text-indentのみが効かなくて、たとえばfont-sizeをいじるとちゃんと変化するんです。

お礼日時：2010/11/18 15:30