GordonZola: a:hover-Problem bei horizontaler float-Navigation

Beitrag lesen

hallo;
hab den ganzen tag gestöbert bin aber hinsichtlich meines derzeitigen problems nicht wirklich fündig geworden;

folgendes problem:
habe eine listen-navigation aufgebaut, die sich mittels float:left horizontal anordnet.

<div id="hauptnavigation">  
  <ul id="h_navi">  
   <li class="h_nav_textlink1"><a href="#" tabindex="1">Textlink1</a></li>  
   <li class="h_nav_textlink2"><a href="#" tabindex="2">Textlink2</a></li>  
   <li class="h_nav_textlink3"><a href="#" tabindex="3">Textlink3</a></li>  
   <li class="h_nav_textlink4"><a href="#" tabindex="4">Textlink4</a></li>  
   <li class="h_nav_textlink5"><a href="#" tabindex="5">Textlink5</a></li>  
   <li class="h_nav_textlink6"><a href="#" tabindex="6">Textlink6</a></li>  
  </ul>  
 </div>

das css dazu gestaltet sich wie folgt:

#hauptnavigation {  
 position: absolute;  
 top: 0px;  
 left: 0px;  
}  
  
#h_navi {  
 list-style-type: none;  
 width: 873px;/*die breite entspricht dem contentbereich und soll das umbrechen der navigation verhindern, wenn das browser-fenster zu klein sein sollte */  
  
}  
  
#h_navi li{  
 float: left;  
 width: auto;  
}  
  
#h_navi li a {  
 padding: 0 9px 0 9px;  
 font-family: Verdana, Helvetica, san-serif;  
 font-size: 11px;  
 line-height: 18px;  
}  
  
.h_nav_textlink1 a, .h_nav_textlink2 a, .h_nav_textlink3 a, .h_nav_textlink4 a, .h_nav_textlink5 a, .h_nav_textlink6 a {  
 position: relative;  
 top: 106px;  
 color: #535353;  
 text-align: center;  
 text-decoration: none;  
}  
  
.h_nav_textlink1 a:hover {  
 color: #0f4678;  
}  
  
.h_nav_textlink2 a:hover {  
 color: #4a7d08;  
}  
  
.h_nav_textlink3 a:hover {  
 color: #d2a903;  
}  
  
.h_nav_textlink4 a:hover {  
 color: #cd4b23;  
}  
  
.h_nav_textlink5 a:hover, .h_nav_textlink6 a:hover {  
 color: #000000;  
}

ansich klappt das (unter OsX) in Firefox und Safari wunderbar und wie gewünscht - aber im IE5 verschwindet beim mouseover die beschriftung des links. der link ist schon noch da nur nicht mehr zu sehen.

wenn ich bei .h_nav_textlink1 a (etc.) position: relative; und top: 106px; auskommentiere bleibt der text mit dem gewünschten :hover stehen, aber natürlich nicht an der stelle an der ich ihn gerne hätte.

würde mich über tipps aller art zur lösung des problems sehr freuen!