Ergebnis 1 bis 1 von 1

Thema: Dropdown Menü

  1. #1
    Matrox
    Gast

    Standard Dropdown Menü

    Moin, moin,

    ich habe mir die letzten Wochen etwas HTML und Css angeeignet und versuche nun eine Website-Steuerung zu erstellen, die waagerecht nach unten aufklappt. Bisher funktioniert auch alles gut, allerdings ist der Innenabstand nach unten ein leerer Raum und ich kann mir nicht erklären wo ich das ganze abstelle. Wie ich die Grundlagen bis jetzt verstehe, bedeutet doch padding-bottom: wert; unterer Abstand?!

    Ich habe aber keine Ahnung warum trotzdem Abstand von den Links nach unten existiert und möchte den gerne weghaben, mein bisheriger Quellcode sieht folgendermassen aus:

    HTML-Code:
    <!DOCTYPE html>
    <html lang="de">
    <head>
        <title>Eigenes Dropdown Men&uuml;</title>
        <meta name="description" content="" />
        <meta name="keywords" content="" />
        <link rel="stylesheet" href="design.css" />
        <link rel="icon" href="bilder/favicon.ico" />
        <meta charset="windows-1252" />
        <meta name="viewport" content="width=device-width,initial-scale=1" />
    </head>
    <body>
        <nav id="nav" role="navigation">
    
            <ul>
    
                <li><a href="">Startseite</a></li>
    
                <li>
                    <a href=""><span>Dropdown Test</span></a>
                    <ul>
                        <li><a href="">Thema1</a></li>
                        <li><a href="">Thema2</a></li>
                        <li><a href="">Thema3</a></li>
                        <li><a href="">Thema4</a></li>
                    </ul>
                </li>
            </ul>
        </nav>
    </body>
    </html>
    HTML-Code:
    body {
        font: 100% arial, verdana, sans-serif;
    }
    ul {list-style: none;}
    
    #nav {
        width: 100%;
        max-width: 1600px;
        margin: 0 auto;
    }
    #nav > a {
        display: none;
    }
    #nav li {
        position: relative;
    }
    #nav li a {
        color: #fff;
        display: block;
    }
    #nav li a:active {
        background: #00ffff;
    }
    #nav span:after {
        content: '';
        vertical-align: middle;
        display: inline-block;
        position: relative;
        right: -0.313em;
    }
    #nav > ul {
        height: 50px;
        background: #414141;
    }
    #nav > ul > li {
        width: 25%;
        max-width: 300px; /* TEST */
        float: left;
    }
    #nav > ul > li > a {
        height: auto;
        text-align: center;
    }
    #nav > ul > li:not( :last-child ) > a {
        border-right: 1px solid #00ffff;
    }
    #nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {
        background: #00ffff;
    }
    #nav li ul {
        background: #414141;
        display: none;
        position: absolute;
        top: 100%;
    }
    #nav li:hover ul {
        display: block;
        left: 0;
        right: 0;
    }
    #nav li:not( :first-child ):hover ul {
        left: -1px;
    }
    #nav li ul li a:hover, #nav li ul:not( :hover ) li.active a {
        background: #00ffff;
    }

    Bitte helft mir, ich komme absolut nicht weiter


    Nachtrag: Hat sich erledigt, man muss hier
    HTML-Code:
    #nav > ul {
        height: 50px;
        line-height: 50px;
        background: #414141;
    }
    noch line-height: selberwert wie die höhe einfügen;

    Dann sieht es aus wie es sein soll
    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 !!!!!
    Geändert von Matrox (04.11.2013 um 09:57 Uhr)

Ähnliche Themen

  1. dropdown menü
    Von tinocio im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 26.05.2010, 19:59
  2. css js dropdown menü
    Von st0ny im Forum HTML & CSS Forum
    Antworten: 10
    Letzter Beitrag: 16.10.2007, 18:26
  3. Dropdown Menü//Javascript
    Von Skaters im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 4
    Letzter Beitrag: 13.08.2007, 02:55
  4. dropdown menü problem
    Von Bit2_Gosu im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 27.05.2007, 00:13
  5. dropdown Menü
    Von wurmax im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 16.11.2006, 21:33

Stichworte

Berechtigungen

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