[Muckel]

Guten Abend allerseids,

unter Webstandards-Projekt - Willkommen habe ich ein Menue gefunden, welches mit einer Verschachtelten Liste arbeitet. Soweid so gut. Für das Wordpress ist das schonmal sehr gut, da hier ja einiges an standard über li Tags aus gegeben wird.

Wenn ich dieses Menue vertical nutze (oben nach unten) funktioniert das auch: klick mich.

Ich möchte jenes Menue gerne horizontal nutzen um dann z.B. einen Link Namens Gallerie zu haben und darunter dann die einzelnen Seiten. Oder die Hauptpunkte der Kategorien, darunter die Unter kategorien usw.

Meine Liste schaut so aus:

<div id="top"> 
  <ul id="menue">
    <li><a href="#">Startseite</a></li>
    <li><a href="#">Gallerie</a></li>
        <ul>
            <li><a href="#">erstes Jahr</a></li>
            <li><a href="#">zweites Jahr</a></li>
                <ul>
                    <li><a href="#">Pfingsten</a></li>
                    <li><a href="#">Großfahrt</a></li>
                </ul>
            <li><a href="#">drittes Jahr</a></li>
        </ul>
    <li><a href="#">Blog</a></li>
    <li><a href="#">Lyrik</a></li>
    <li><a href="#">Liedgut</a></li>
    <li><a href="#">Pfadfinder</a></li>
    <li><a href="#">Rheuma</a></li>
    <li><a href="#">Ausbildung</a></li>
    <li><a href="#">Links</a></li>
    <li><a href="#">Kontakt</a></li>
    <li><a href="#">Impressum</a></li>
  </ul>
</div>

Das betreffende CSS:

/*Menue*/
ul#menue, ul#menue ul
{
    list-style-type:    none;
/*    width:            100px;*/
    padding:        0;
    margin:            0;
}

ul#menue li:first-child
{
    border: 1px solid #000000;
}

ul#menue li
{
    margin: 0;
    padding: 0;
    height: 25px;
    line-height: 25px;
    text-align: center;
    border: 1px solid #000000;
    border-top: none;
    background: #E6E6E6;
    color: #000000;
    text-decoration: none;
    float: left;
}

ul#menue li a
{
    display: block;
    height: 26px;
    width: 75px;
    padding-top: 4px;
    background-color: #E6E6E6;
    text-align: center;
    text-decoration: none;
    font-weight:bold;
    color: #000000;
    border-right: 1px solid #000000;
}

ul#menue li > ul
{
    position:        relative;
    left:            +99px;
    top:            -25px;
    display:        none;
}

ul#menue li:hover > ul
{
    display:        block;
}

ul#menue li ul
{
    margin-top:        -1px;
    margin-left:        -1px;
}

Und der Link zum ganzen: jurtenrunde.de, muckels-fahrtenleben.de, muckels-leben.de ~ der Jugendbewegung verschrieben

Problem ist, dass die Unterpunkte falsch gezeigt werden bzw. es erst garnicht funktioniert. Kann mir dabei jemand helfen? Ich weiß, es gibt viele PlugIns - aber ich hätte gerne eine Variante ohne PlugIn, damit man das Design wirklich einfach verwenden kann. (Das Design ist bislang noch nicht an den IE angepasst).

Gruß und vielen Dank
Muckel