CSS-Menü spinnt im IE

Eßer

Hallo zusammen,

ich habe ein Problem mit nem CSS-Menü.

Es geht um folgende Seite:
http://www.maigesellschaft-derichsweiler.de/files/index_neu.php?seite=index_neu

In Firefox funktioniert das Menü wunderbar. Ich benutze JavaScript zu Aufklappen, weil IE6 li:hover nicht versteht. Sobald das innere Menü aber mit display:block angezeigt wird, ist die Box um das äußere Menüelement größer, wohlgemerkt nur im IE.

So sieht das im IE aus.

Der relevante Code ist folgender:

<ul class="Nav">
  <li id="navi_link_0">
    <div><a class="dl" href="index.php" style="font-weight:bold;">Startseite</a></div>
  </li>
  <li id="navi_link_1">

    <div><a class="dl" href="termine.php">Termine</a></div>
  </li>
  <li id="navi_link_2">
    <div><a class="dl" href="gesellschaft.php" >Gesellschaft</a></div>
    <ul class="SubNav" id="SubNav_2">
      <li><div><a href="maikoenigspaar.php?jahr=2006">Maik&ouml;nigspaar</a></div></li>
      <li><div><a href="vorstand.php">Vorstand</a></div></li>

      <li><div><a href="reiter.php">Reiter</a></div></li>
      <li><div><a href="techniker.php">Techniker</a></div></li>
      <li><div><a href="remmel.php">Remmel</a></div></li>
      <li><div><a href="baumtraeger.php">Baumtr&auml;ger</a></div></li>
      <li><div><a href="liedgut.php">Liedgut</a></div></li>
    </ul>

  </li>
  <li id="navi_link_3">
    <div><a class="dl" href="bilder.php">Bilder</a></div>
  </li>
  <li id="navi_link_4">
    <div><a class="dl" href="statuten.php">Statuten</a></div>
  </li>
  <li id="navi_link_5">

    <div><a class="dl" href="geschichte.php">Geschichte</a></div>
    <ul class="SubNav" id="SubNav_5">
      <li><div><a href="vorsitzende.php">Vorsitzende</a></div></li>
      <li><div><a href="koenige.php">Maik&ouml;nigspaare</a></div></li>
      <li><div><a href="ehrennadelraeger.php">Ehrennadeltr&auml;ger</a></div></li>
    </ul>

  </li>
  <li id="navi_link_6">
    <div><a class="dl" href="http://forum.maigesellschaft-derichsweiler.de/index.html" title="Forum" target="_blank">Forum</a></div>
  </li>
  <li id="navi_link_7">
    <div><a class="dl" href="links.php">Links</a></div>
  </li>
  <li id="navi_link_8" style="border-bottom: 1px solid black;">

    <div><a class="dl" href="kontakt.php">Kontakt</a></div>
  </li>
</ul>

Und der CSS-Teil:

.Nav {
padding-left: 1em;
padding-top: 1em;
margin:0;
}

.Nav li {
  list-style-type: none;
  list-style-image: none;
  list-style-position: outside;
  background:green;
  border-top: 1px solid black;
  border-right: 1px solid black;
  border-left: 1px solid black;
  position: relative;
}
.Nav li div {
  padding:2px;
  padding-left:6px;
}

.SubNav{
  display:none;
  margin: -1px 0px 0px -1px;
  padding:0em;
  position: absolute;
  top: 0em;
  left: 9em;
  border-bottom: 1px solid black;
}

.SubNav li{
  background:white;
  border-left: 0px;
}

.SubNav li div {
  padding: 1px 1em;
}

Es wäre nett, wenn ihr mir helfen könntet.

Danke

Christoph

Linnea

nimm mal die ganzen Div-Elemente aus der Liste raus, danach gehts dann auch im IE 6
die Angabe zum CSS der Divs kannst du mit in die Anweisung der Li-Elemente schreiben

Eßer

Danke, das war's. Die divs waren wohl noch ein Relikt von früher. Allerdings finde ich schwer verständlich, dass der IE sich davon durcheinander bringen lässt...

Jetzt muss ich nur noch die Probleme mit dem bescheuerten Box-Model-Fehler im IE wegkriegen, dann war's das soweit.

Danke!

Rhombicosidodecahedron

Eßer schrieb:

Danke, das war's. Die divs waren wohl noch ein Relikt von früher. Allerdings finde ich schwer verständlich, dass der IE sich davon durcheinander bringen lässt...

Jetzt muss ich nur noch die Probleme mit dem bescheuerten Box-Model-Fehler im IE wegkriegen, dann war's das soweit.

Danke!

Das war kein Fehler das war Absicht!