【CSS】firefoxで背景が表示されない－ナビゲーション（画像置換リンク）
「li」に背景画像を指定して、ナビゲーションをつくってみたところ・・・
Firefox、Operaで表示されません。
（IEでは表示されます。）
ヘッダー左にロゴ（これはどのブラウザでも表示される）、右側にナビゲーションを配置した作りです。
ハックなど色々調べてみたのですが、解決できず・・・。
力をお貸しいただけないでしょうか。
g_nav.gif・・・グローバルナビゲーション一枚画像550px×30px。（上部：ロールオーバー前、下部：ロールオーバー時）
【HTML】
<!--headerここから-->
<div id="header">
<!--logoここから-->
<div id="logo">
<h1><a href="aaa.html">logo</a></h1>
</div>
<!--logoここまで-->
<!--naviここから-->
<div id="nav">
<ul>
<li id="nav01"><a href="aaa.html">あああ</a></li>
<li id="nav02"><a href="aaa.html">あああ</a></li>
<li id="nav03"><a href="aaa.html">あああ</a></li>
<li id="nav04"><a href="aaa.html">あああ</a></li>
<li id="nav05"><a href="aaa.html">あああ</a></li>
</ul>
</div>
<!--naviここまで-->
</div>
<!--headerここまで-->
【CSS】
#header{
width:800px;
height:70px;
margin:0 auto;
padding:0;
}
#logo {
width:216px;
height:70px;
background-image:url(../cmn_img/logo.gif);
float:left;
}
#nav{
width:550px;
height:30px;
float:right;
margin:40px 0 0 0;
padding:0;
text-indent:-999em;
}
#nav ul{
margin:0;
padding:0;
list-style-type:none;
}
#nav li{
display:inline;
}
#nav li#nav01 a,#nav li#nav02 a,#nav li#nav03 a,#nav li#nav04 a,#nav li#nav05 a,{
display:block;
background-image:url(../cmn_img/g_nav.gif);
overflow:hidden;
float:left;
}
#nav li#nav01 a{width:110px; height:30px; background-position:0 0;}
#nav li#nav02 a{width:110px; height:30px;background-position:-110px 0;}
#nav li#nav03 a{width:110px; height:30px;background-position:-220px 0;}
#nav li#nav04 a{width:110px; height:30px;background-position:-330px 0;}
#nav li#nav05 a{width:110px; height:30px;background-position:-440px 0;}
#nav li#nav01 a:hover{width:110px; height:30px;background-position:0 -30px;}
#nav li#nav02 a:hover{width:110px; height:30px;background-position:-110px -30px;}
#nav li#nav03 a:hover{width:110px; height:30px;background-position:-220px -30px;}
#nav li#nav04 a:hover{width:110px; height:30px;background-position:-330px -30px;}
#nav li#nav05 a:hover{width:110px; height:30px;background-position:-440px -30px;}
【下記ハック使用】
#header:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#header {display: inline-table;}
/* Hides from IE-mac \*/
* html #header {height: 1%;}
#header {display: block;}
/* End hide from IE-mac */
