Tooltip Probleme mit IE

[tangotänzer]

Liebe Leute im Forum,

habe eine Navigation und dazu einen Tooltip wenn man mit der Maus rüberfährt. Soweit so gut. Firefox zeigt es mir in der gewünschten Form an, nämlich ,dass der Tooltip gut lesbar ist, wenn man mit der Maus darüber fährt. Nur der IE ganz gleich in welcher Version zeigt den Text zwar an, aber der Text vom Tooltip überdeckt nicht den Text der Navigation, sondern vermischt sich mit den Buchstaben der Navigation. Zu sehen ist regelrechter Buchstabensalat. Hat jemand von Euch eine Idee woran das liegen könnte???

Vielen Dank und beste Grüße
Tangotänzer

Der verwendete CSS-Code:

#navigationblock {  
  float: left;  
  background-color: transparent;  
  margin-top: 3em;  
  padding-left: 0;  
  padding-top: 0;  
  padding-bottom: 4.5em;  
  overflow: visible;  
  position: relative;  
  z-index: 1;  
  }  
  
#navigationblock a {  
  font-family: Arial, Helvetica, Sans-serif;  
  outline: none;  
  }  
  
#navigationblock a:link {  
  color: #333;  
  }  
  
#navigationblock a:visited {  
  color: #333;  
  }  
  
#navigationblock a:hover {  
  background: #A40037;  
  border: none;  
  border-left: 0 solid red;  
  color: white;  
  font-weight: normal;  
  }  
  
ul#navigationseite {  
  padding: 0;  
  border-bottom: 0em solid gray;  
  border-right: 0em solid gray;  
  margin: 0em;  
  background: none;  
  font-family: Arial, Helvetica, Sans-serif;  
  font-size: 1.0em;  
  }  
  
ul#navigationseite li {  
  list-style: none;  
  margin: 0em;  
  border: 0em;  
  font-family: Tahoma, Arial, Helvetica, Sans-serif;  
  font-size: 0.9em;  
  }  
  
ul#navigationseite li a {  
  display: block;  
  padding: 0.1em 0 0.4em 0.6em;  
  border: 0;  
  border-left: 0 solid gray;  
  border-bottom: 0 solid gray;  
  background: none;  
  text-decoration: none;  
  text-align: left;  
  text-indent: 0;  
  height: 1.0em;  
  }  
  
  
  
  
/* ---------------- TOOLTIP der Navigation ----------------------- */  
a.tooltip,  
a.tooltip:link,  
a.tooltip:visited,  
a.tooltip:active {  
  position: relative;  
  text-decoration: none;  
  background: #c9ff96;  
  }  
  
a.tooltip:hover {  
  background: #c9ff96;  
  }  
  
a.tooltip span {  
  display: none;  
  text-decoration: none;  
  }  
  
a.tooltip:hover span {  
  display: block;  
  position: absolute;  
  top: 3.3em;  
  left: -20em;  
  width: 25em;  
  color: #333;  
  border: 0.1em solid #A9A9A9;  
  padding: 0.7em 1.0em 0.7em 1.0em;  
  background: #C9FF96;  
  font-family: Verdana, Arial, Helvetica, Sans-serif;  
  font-style: normal;  
  text-align: left;  
  line-height: 1.5em;  
  font-size: 0.8em;  
  z-index: 10;  
  }

[LX]

Hallo!

Mache Dir das Leben einfach und verwende das title-Attribut.

Gruß, LX