Listen (li) nebeneinander, variable Breite und IE5

[delirium]

Hallo,

ich habe in einer Seite zur Navigation verschiedene "Tabs" mit Listen erstellt. Mit "list-style-type:none" sorge ich dafür, dass die <li>s nebeneinander angezeigt werden. Damit die Breite automatisch festgelegt wird, habe ich eine "width"-Angabe weggelassen.

Das ganze funktioniert in Opera, Firefox und IE7 so, wie es soll. Nur der IE6 macht - mal wieder - Probleme. Wenn ich keine feste Breite angebe, werden die <li>s untereinander angezeigt, gebe ich eine feste Breite an, geht's. Allerdings möchte ich die Breite eben nicht festlegen. Habe es bereits mit "display:block" und "display:inline" versucht. Selbes Ergebnis.

Komme leider nicht weider und hoffe, Ihr könnt mir helfen.

Demo: http://onfpb.pytalhost.com/tab

HTML-Code:

  
[...]  
<div class="tab">  
  <div class="tab_tabs">  
  
  <!-- Haupt-Tabs -->  
  <ul class="tab">  
    <li><img src="BILD" alt="" /><div class="text"><a href="URL">NAME</a></div></li>  
    <li class="active"><img src="BILD" alt="" /><div class="text"><a href="URL">NAME AKTIV</a></div></li>  
  </ul>  
  <div class="clear"></div>  
  <div class="content">  
    INHALT  
  </div>  
[...]  

CSS-Code:

  
[...]  
ul.tab {  
  padding: 0px 0px 0px 25px;  
  margin: 0px;  
  font-family: verdana;  
  list-style-type: none;  
}  
  
ul.tab li {  
  margin-right: 10px;  
  color: #736658;  
  background: url(./img/tab/tab_inactive_bg.png);  
  float: left;  
}  
  
ul.tab li img {  
  margin: 9px 4px 0px 9px;  
  float: left;  
  padding: 0px;  
  width: 16px;  
  height: 16px;  
}  
  
ul.tab li .text {  
  padding: 9px 8px 0px 0px;  
  height: 24px;  
  background: url(./img/tab/tab_inactive_re.png) no-repeat right top;  
}  
  
ul.tab li.active .text {  
  background: url(./img/tab/tab_active_re.png) no-repeat right;  
}  
  
ul.tab li.active {  
  color: #fff;  
  background: url(./img/tab/tab_active_bg.png);  
}  
  
ul.tab a:link, ul.tab a:visited {  
  color: #5B5147;  
  text-decoration: none;  
}  
  
ul.tab a:active, ul.tab a:hover {  
  color: #7D7165;  
  text-decoration: none;  
}  
  
ul.tab li.active a:link, ul.tab li.active a:visited, ul.tab li.active a:active, ul.tab li.active a:hover{  
  color: #fff;  
}  
[...]  

Vielen Dank,
delirium