Отображение горизонтального меню в Firefox

Здравствуйте! Возникла проблема с коректностью отображения горизонтального меню в браузере Firefox. Вместо отобюражения в одну строку, меню выводится встолбик. Как можно это исправить?
P.S.: Во всех остальных браузерах(в том числе IE6) отображается коректно.

HTML:

<div class="top_menu">    
<ul id="top_menu">      
<a href="/"><li class="logo"> </li></a>      
<a href="#"><li class="about"> </li></a>      
<a href="/pravela.html"><li class="rule"> </li></a>      
<a href="/sitenews/"><li class="newss"> </li></a>      
<a href="/faq.html"><li class="faq"> </li></a>      
<a href="/copyright.html"><li class="holders"> </li></a>      
<a href="/index.php?do=feedback"><li class="contact"> </li></a>    
</ul>  
</div>

Code:

<!--Top menu-->
.top_menu {
width:1001px; 
margin:0; 
padding:0px;}
.logo { 
background-image:url(../images/logo.jpg); 
height:35px; 
width:143px;
}
.logo:hover { 
background-image:url(../images/logo_dark.jpg); 
height:35px; 
width:143px;
}
.about { 
background-image:url(../images/about.jpg);  
height:35px; 
width:143px;
}
.about:hover { 
background-image:url(../images/about_dark.jpg);  
height:35px; 
width:143px;
}
.rule { background-image:url(../images/rule.jpg); 
height:35px; 
width:143px;
}
.rule:hover { 
background-image:url(../images/rule_dark.jpg); 
height:35px; 
width:143px;
}
.newss { 
background-image:url(../images/news.jpg); 
height:35px; 
width:143px;
}
.newss:hover { 
background-image:url(../images/news_dark.jpg); 
height:35px; 
width:143px;
}
.faq { 
background-image:url(../images/faq.jpg); 
height:35px; 
width:143px;
}
.faq:hover { 
background-image:url(../images/faq_dark.jpg); 
height:35px; 
width:143px;
}
.holders { 
background-image:url(../images/holders.jpg); 
height:35px; 
width:143px;
}
.holders:hover { 
background-image:url(../images/holders_dark.jpg); 
height:35px; 
width:143px;
}
.contact { 
background-image:url(../images/contact.jpg); 
height:35px; 
width:143px; 
float:none !important; 
float:left;
}
.contact:hover { 
background-image:url(../images/contact_dark.jpg); 
height:35px; 
width:143px; 
float:none !important; 
float:left;
}

 

Хитро написано, а не проще ли использовать таблицу !?

На сколько помню - коряво проперитарные свойства "<li>" пытаться править с помощью "CSS" - <li> сам по себе переходит на новую строку