Landoran: IE-Bug bei Hover über Links

Beitrag lesen

Hallo,

so, jetzt ist die Testseite aber geprüft und als XHTML 1.1 valid erkannt !
Das Problem besteht jedoch unverändert - was nicht überrascht, schliesslich ist der Bug des IE 6 immer noch existent :)

Also hier die 100% valide Testseite:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
<title>Mustertabelle</title>
<style type="text/css">
* { margin:0; padding:0;  }
html, body { height:100%; }

body {  padding-left: 12em;
        color: black;  font-family: verdana, sans-serif;  }

#Inhalt { width:100%; margin-left:-1px; }

div#Inhalt {
    padding: 1em;
    margin: 0px 0em 0px -0.5em;
}

/* Top-Navigation */
ul#top_navigation {
    border-width: 0px;
    font-size: 0.7em;
    margin-right: 17.1em;
    background-color: #205671;
    text-align: center;
}

/* Link in Liste in der Top-Navigation */
ul#top_navigation a {
    font-weight: bold;
    color: white;
    background-color: #205671;
    text-decoration: none;
}

div#micronavi { font-size: 0.7em; }
div#content   { font-size: 0.8em;  padding-right: 1em; }
a:hover       { background: #eeeeee; }
H2            { padding-top:1em;  }

#link_logo_rechts {
    right: 8px; top: 8px;  position: absolute; }

ul#mehrsprachigkeit {
    padding-left: 0.6em;
    font-size: 0.7em;
    right: 0.6em;
    width: 13.9em;
    position: absolute;
    margin-top: -1.15em;
    height: 1.15em;
    background-color: #c0c0c0;
    text-align: center;
}

* html ul#mehrsprachigkeit { padding-left: 0.4em; }
html ul#mehrsprachigkeit { width: 13.75em; }
ul#mehrsprachigkeit li { list-style-type: none; }
ul#mehrsprachigkeit a { border: 0px; }
TD { BORDER: #000 1px solid; }

#logo_links  { width:11em;   height:8.1em; }
#top_grafik  { width:14.2em; height:6.6em; }
#logo_rechts { width:10.4em; height:6em;   }
#spr         { width:3em;    height:1em;   }
</style>
</head>

<body>
  <div id="wrap">
    <div id="Inhalt" >
      <div id="top" >

<img src="./top1.jpg" id="top_grafik" alt="grafik"></img>

<a href="www.x.de" id="link_logo_rechts">
          <img src="./rechts1.gif" id="logo_rechts" title="Rechtslogo1" alt="rechtslogo1"></img>
        </a>

<ul id="top_navigation">
          <li><a href="x" class="top">Dies ist der ERSTE Link</a></li>
        </ul>

<ul id="mehrsprachigkeit">
          <li><a href="x">
     <img src="./de1.gif" id="spr" title="Rechtslogo2" alt="rechtslogo2"></img>
     </a>
    </li>
        </ul>

</div>  <!--- div TOP -->
      <br />

<div id="micronavi">
        <a href="x" class="micronavi" >Dies ist der ZWEITE Link</a>
      </div> <!-- div MICRONAVI -->

<div id="content">
        <h2>Ergebnistabelle:</h2>
        <table>
          <tr>
            <td>Spalte01Spalte01</td> <td>Spalte02Spalte02</td>
            <td>Spalte03Spalte03</td> <td>Spalte04Spalte04</td>
            <td>Spalte05Spalte05</td> <td>Spalte06Spalte06</td>
            <td>Spalte07Spalte07</td> <td>Spalte08Spalte08</td>
     <td>Spalte09Spalte09</td>
          </tr>
        </table>

</div> <!-- div CONTENT -->
    </div> <!-- div INHALT -->
  </div> <!-- div WRAP -->
</body>
</html>

Wenn jemand eine Idee hat, wie das Repositionieren der rechts oben gelegenen Grafiken (ja ich weiß, Bilder sind nicht dabei, aber der leeren Grafikrahmen!) verhindern kann, wäre ich sehr dankbar.

Viele herzliche Grüße,
Landoran