Ergebnis 1 bis 2 von 2

Thema: Menü mit Untermenüs klappt nicht

  1. #1
    HTML Newbie
    Registriert seit
    25.01.2015
    Beiträge
    1
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Menü mit Untermenüs klappt nicht

    Hallo zusammen,

    ich bastel hier grad an meiner Fotohomepage und bin am Menü. Ich muss gestehen ich hab von CSS nicht wirklich Ahnung. Ich hab also ein horizontales Menü mit 5 Hauptpunkten. Drei dieser Hauptpunkte haben nun vertikale Unterpunkte. Bis hierhin war noch alles per Tutorial ganz gut machbar. Jetzt kommt aber die Schwierigkeit, dass eines der Untermenüs über weitere Unterpunkte verfügen soll. Das Problem ist nun, dass diese 3. Ebene exakt über der zweiten Ebene liegt (vertikal) und daher Punkte dieser 2. Ebene verdeckt. Meine Wunschvorstellung ist nun, dass die 3. Ebene rechts von der 2. Ebene runter klappt. Ich hoffe, ich hab mich einigermaßen verständlich ausgedrückt. Wäre echt super, wenn mir hier jemand helfen könnte.


    Code:
    <nav>
                <ul>
                    <li class = "cat1">
                        <a href="index.shtml">Home</a>
                    </li>
                    <li class = "cat2">
                        <a href="ueber_mich.shtml">über mich</a>
                        <ul>
                            <li><a href="#">ich stelle mich vor</a></li>
                            <li><a href="#">meine Hardware</a></li>
                        </ul>
                    </li>
                    <li class = "cat3">
                         <a>Galerien</a>
                         <ul>
                             <li><a href="ramona.shtml">Ramona</a>
                                <ul>
                                   <li><a href="#">Seite 1</a></li>
                                   <li><a href="#">Seite 2</a></li>
                               </ul>
                             </li>
                             <li><a href="yvonne.shtml">Yvonne</a></li>
                             <li><a href="franzi.shtml">Franzi</a></li>
                             <li><a href="micu.shtml">Micu</a></li>
                             <li><a href="rami.shtml">Rami</a></li>
                             <li><a href="irland.shtml">Irland</a></li>
                             <li><a href="gemischtes.shtml">Gemischtes</a></li>       
                         </ul>
                    </li>
                    <li class = "cat4">
                        <a href="gaestebuch.shtml">Gästebuch</a>
                    </li>
                    <li class = "cat5">
                        <a>Impressum</a>
                        <ul>
                            <li><a href="impressum.shtml">Haftungsausschluss</a></li>
                            <li><a href="datenschutz.shtml">Datenschutz</a></li>
                        </ul>
                    </li>
                </ul>
            </nav>

    Code:
    nav {
        width: auto;
     }
     nav ul {
        padding: 0px;
        margin: 0px;
     }
     nav ul:after {
        clear: both;
        content: " ";
        display: block;
        font-size: 0;
        height: 0;
        visibility: hidden;
     }
     nav ul li {
        list-style: none;
        float:left;
     }
     nav ul li a {
        background-color: #000000; /* Menüfarbe ohne hover*/
        text-decoration: none;
        display: block;
    color: #FFFFFF; /* Textfarbe ohne hover oben weiss*/
     font-size: 110%;
        padding: 5px 14px;
        transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
     }
     nav ul li.cat1:hover a, nav ul li.cat1:hover > ul li a  {
        background-color: #a5a9ac;
     }
     nav ul li.cat2:hover a, nav ul li.cat2:hover > ul li a  {
        background-color: #a5a9ac;
     }
     nav ul li.cat3:hover a, nav ul li.cat3:hover > ul li a {
        background-color: #a5a9ac;
     }
     nav ul li.cat4:hover a, nav ul li.cat4:hover > ul li a {
        background-color: #a5a9ac;
     }
     nav ul li.cat5:hover a, nav ul li.cat5:hover > ul li a {
        background-color: #a5a9ac;
     }
     nav ul li:hover > a {
        color: #FFFFFF; /* Textfarbe hover weiss*/
     }
     nav ul li:hover > ul {
        visibility: visible;
     }
     nav ul li ul{
        display: inline;
        visibility: hidden;
        position: absolute;
        padding:0px;
     }
     nav ul li ul li{
     float: none;
     }
     nav ul li ul li a {
        color: #FFFFFF; /* dropdown Textfarbe ohne Auswahl weiss*/
     }
     nav ul li ul li a:hover{
     background-color: #000000 !important; /* dropdown Auswahl Hintergrundfarbe schwarz*/
     }
    Danke! Grüße, Mike
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Meister(in)
    Registriert seit
    24.02.2007
    Beiträge
    460
    Danke
    0
    Bekam 47 mal "Danke" in 47 Postings

    Standard AW: Menü mit Untermenüs klappt nicht

    Guck mal hier ob du das gebrauchen kannst. Sind 2 Teile
    http://www.gipspferd.de/css/anleitung/a20/a20.php

Ähnliche Themen

  1. IE 8, Menü klappt wegen Transparenz nicht auf
    Von nova2004de im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 11.06.2014, 08:07
  2. CSS Aufklappmenü klappt nicht
    Von hüttenliesl im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 25.02.2013, 20:51
  3. INSERT klappt nicht / utf8 nicht übernommen
    Von craven-city im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 06.11.2008, 15:33
  4. Antworten: 9
    Letzter Beitrag: 15.10.2008, 15:20

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •