IE Problem mit verschachtelter Liste

[Martin Hölter]

Hallo Forum!

Der IE macht mir Probleme mit einer verschachtelten Liste (Navigation).
Zu bewundern ist das ganze unter http://sparkasseiserlohn.de/ihre_sparkasse/beitraege/wirtschaft_und_politik/index.htm.

Die Listen-Elemente, die vor der Verschachtelung stehen, werden erst beim hovern sichtbar und bleiben es danach auch.

Kennt jemand von euch das Problem und kann mir helfen?

Hier noch der betroffene Code:

HTML:

<ul id="subnav">
  <li><a href="../../ihre_meinung_ist_uns_wichtig.htm" title="Ihre Meinung ist uns wichtig">Ihre Meinung ist uns wichtig</a></li>
  <li><a href="../../wir_ueber_uns.htm" title="Wir &uuml;ber uns">Wir &uuml;ber uns</a></li>
  <li><a href="../../mit_engagement_fuer_unsere_stadt/index.htm" title="Mit Engagement f&uuml;r unsere Stadt">Mit Engagement f&uuml;r unsere Stadt</a></li>
  <li><a href="../../buergerstiftung_der_sparkasse/index.htm" title="B&uuml;rgerstiftung der Sparkasse Iserlohn">B&uuml;rgerstiftung der Sparkasse</a></li>
  <li><a href="http://www.iserlohn-kunstpreis.de" title="Iserlohner Kunstpreis - vergeben durch die B&uuml;rgerstiftung der Sparkasse Iserlohn">Iserlohner Kunstpreis</a></li>
  <li><a href="../../s-probis.htm" title="S-Probis - Sparkassen-Projektbeteiligungen Iserlohn GmbH"><img src="../../../images/s_9wtgen.gif" alt="S-" title="">Probis</a></li>
  <li><a href="../../servicecenter/index.htm" title="ServiceCenter">ServiceCenter</a></li>
  <li><a href="../../ausstellungen_und_veranstaltungen.htm" title="Ausstellungen und Veranstaltungen">Ausstellungen und Veranstaltungen</a></li>
  <li><a href="../../newsletter/index.htm" title="Newsletter - w&ouml;chentlich aktuelle Neuigkeiten von Ihrer Sparkasse">Newsletter</a></li>
  <li><a href="../../ihre_ansprechpartner/index.htm" title="Ihre Ansprechpartner in unseren Fachabteilungen">Ihre Ansprechpartner</a></li>
  <li><a href="../../geschaeftsstellen/index.htm" title="unsere Gesch&auml;ftsstellen">Gesch&auml;ftsstellen</a></li>
  <li><a href="../../virtuell_durch_die_hauptstelle/index.htm" title="virtuell durch die Hauptstelle">virtuell durch die Hauptstelle</a></li>
  <li><a href="../../beitraege/index.htm" title="laufend aktuelle Beitr&auml;ge und Informationen">Beitr&auml;ge</a></li>
  <li><ul>
   <li><a href="../../newsletter/index.htm" title="Newsletter - w&ouml;chentlich aktuelle Neuigkeiten von Ihrer Sparkasse">Newsletter</a></li>
   <li><a href="../finanzen/index.htm" title="Beitr&auml;ge zum Thema Finanzen" class="aktiv">Finanzen</a></li>
   <li><a href="../bauen_und_wohnen/index.htm" title="Beitr&auml;ge zum Thema Bauen und Wohnen"">Bauen und Wohnen</a></li>
   <li><a href="../steuern/index.htm" title="Beitr&auml;ge zum Thema Steuern">Steuern</a></li>
   <li><a href="../internet/index.htm" title="Beitr&auml;ge zum Thema Internet">Internet</a></li>
   <li><a href="./index.htm" title="Beitr&auml;ge zum Thema Wirtschaft und Politik">Wirtschaft und Politik</a></li>
  </ul></li>
  <li><a href="../../tipps_zur_website.htm" title="Tipps zur Website Sparkasse-Iserlohn.de">Tipps zur Website Sparkasse-Iserlohn.de</a></li>
 </ul>

CSS:
#nav  /*Navigationsbereich links*/
  {clear:left;  /*clear beendet das floaten, somit steht die Navigation unter dem roten Bereich*/
  float:left;  /*wird links umflossen*/
  width:184px;  /*184 Pixel breit*/
  background-color:#AAA;}

#nav ul  {list-style-type:none;
  margin:0;
  /*padding:0;*/
  border-top:1px solid #FFF;}

#mainnav li {border-bottom:1px solid #FFF;}

#mainnav a  /*Links im Navigationscontainer*/
  {display:block;  /* werden als Block-Elemente angezeigt, somit gehen Sie ueber die gesamte Breite des Elternelements (also des Navigationscontainers)*/
  background-color:#AAA;
  text-transform:uppercase; /*Grossbuchstaben*/
  font-size:1.1em;
  font-weight:bolder;
  padding:1px 0 2px 10px; /*Innenabstand: oben:2 Pixel, rechts:0, unten:2 Pixel,  links: 10 Pixel*/}

#mainnav a:link, #nav a:visited /*Navigationslinks werden weiss*/
  {color:#FFF;}

#mainnav a:hover, #nav a:active, #nav a:focus /*Navigationslinks werden beim ueberfahren weiss auf rot*/
   {background-color:#F00;
  color:#FFF;}

#mainnav a.aktiv:link, #mainnav a.aktiv:visited, #mainnav a.aktiv:hover, #mainnav a.aktiv:active, #mainnav a.aktiv:focus
  {background-color:#F00;}

#subnav  /*Subnavigation (hellgrauer Bereich)*/
  {padding-top:35px; /*Innenabstand oben: 40 Pixel*/
  padding-left:2px; /*Innenabstand links: 3 Pixel*/
  background-color:#EEE;
  font-weight:bold;
  border-style:none;}

#subnav li {padding-left:10px;
  padding-top:2px;
  padding-bottom:2px;}

#subnav a {display:inline;
  background-color:#EEE;
  font-size:11px;
  text-transform:none;} /*keine Grussbuchstaben*/

#subnav a:link, #subnav a:visited {color:#666;}

#subnav a:hover, #subnav a:active, #subnav a:focus
  {color:#F00;
  background-color:#EEE;}

#subnav a.aktiv:link, #subnav a.aktiv:visited, #subnav a.aktiv:hover, #subnav a.aktiv:active, #subnav a.aktiv:focus
  {color:#F00;}

#subnav ul {padding-left:10px; /*Sub-Sub-Navigation*/
  border:none;}

#subnav ul a {font-weight:normal;}

Vielen Dank vorab für Eure Hilfe!

Gruß

Martin