CSS Aufklappmenü klappt nicht

  • Hallo zusammen,
    ich bin neu hier und auch relativ frisch mit CSS3 unterwegs. Manches möchte noch nicht so funktionieren wie es soll.
    Seit Tagen hänge ich an einem CSS-Aufklappmenü für eine (responsive) Website.
    Das Menü sieht so aus:



    <div id="nav">
    <ul>
    <li><a href="index.html">Start</a></li>

    <li><a href="details.html">Details</a></li>
    <ul><li><a href="">Internetfrontend</a></li>
    <li><a href="">Features</a></li>
    <li><a href="">Verwaltung</a></li>
    <li><a href="">Handling</a></li>
    </ul>
    <li><a href="#">Onlinedemo</a></li>
    <ul><li><a href="">Frontend Internet</a></li>
    <li><a href="">Backend Admin</a></li>
    <li><a href="">Backend Agentur</a></li>
    <li><a href="">Musterhomepage</a></li>
    </ul>
    <li><a href="#">Preisangebot</a></li>
    <li><a href="#">Kontakt</a></li>

    </ul>
    </div>



    Solange ich nichts bestimmtes tu, sind alle Menüpunkte bei der Mobile-Version brav untereinander. Ich möchte aber, dass die 2. Naviebene nur beim Hovern eines Listenpunktes eingeblendet wird. Da scheitere ich. Display:none funktioniert noch, aber weiter tut sich nix :confused:. Hab ich Tomaten auf den Augen???


    /*klapp mich auf*/
    #nav ul ul{
    display: none;
    }


    #nav li:hover ul {
    display: block;
    }


    Manche Tutorials arbeiten auch mit verschieben anstatt mit display, hab ich auch getestet, geht auch nicht. Ich vermute den Fehler bei "#nav li:hover ul ", aber ich komm einfach net drauf :mad:


    Grüße, Martina

  • Wie meinst du, nicht in einem li drin?
    Hmm vielleicht etwas unübersichtlich hier mal die Struktur gekürzt...


    <ul>
    <li>...</li>
    <li><a...>Details</a></li>
    <ul>
    <li><a...>...</a></li>
    <li><a...>...</a></li>
    <li><a...>...</a></li>
    <li><a...>...</a></li>
    </ul>
    </ul>


    ist das falsch?? Muss ich das schließende </li> bei Details ganz ans Ende von der zweiten Liste setzen?


    Lg Martina