✔ Dropdown-Navigation Probleme

mAu

mAu

Erfahrenes Mitglied
Hallo Community.

Bin leicht verzweifelt, da ich bis Montag ein Auftritt online haben muss aber das Layout hinten und vorne nicht will :)

Das Layout: http://www.zurv.de/tutorials.de/ghb/index.html, http://www.zurv.de/tutorials.de/ghb/anmeldung.html

Erster Punkt, die Dropdown-Navigation:
Die Unternavigation soll mit einem transparenten, weißen Hintergrund hinterlegt sein. Aber das übergeordnete Listenelement soll nicht breiter werden, wenn die Unterpunkte breiter sind. Das funktioniert soweit, nur dass eben die Unternavigation auch nur die feste Breite des übergeordneten Elements hat und der Hintergrund somit nicht über die komplette Breite des Untermenüs geht.
Ich habe den Menüs mal zur Veranschaulichung einen roten und grünen Border gegeben.

Relevanter CSS-Code (screen.css):
Code: 
#navigation {        
        display: block;
        
        height: 16px;
        
        list-style: none;
        
        top: 49px;
        
        position: absolute;
        
        width: 900px;
        
        z-index: 3;
}

#navigation li ul.subnavigation {        
        background: url('../graphics/navigation_bg.png');
        
        border: 1px solid red;
        
        display: none;
        
        list-style: none;
        
        white-space: nowrap;
        
        padding: 5px;
}

/* ... */


#navigation li ul.subnavigation a:hover, #sidebar li a:hover {
        background: url('../graphics/active_link.gif') no-repeat 0 2px;
        
        margin-left: -5px;
        
        padding-left: 5px;
        
        color: #666; 
}


#navigation li ul.subnavigation li {
        
        background: url('../graphics/navigation_bg.png');
        border: 1px solid green;
        
        float: none;
        
        margin-top: 2px;
        
        position: relative;
        
        z-index: 3;
}

#navigation li:hover ul.subnavigation {
        display: block;
}
Zweiter Punkt, das Layout an sich:
Ich habe erst mit einem absolut positionierten Layout versucht. Da dann aber der Footer nicht am Ende des Layouts erscheint, wenn der Content mal länger wird, habe ich mich für ein floating Layout entschieden und die Elemente mittels margin und padding positioniert.
Würdet ihr das anders regeln bzw. wie würdet ihr das Layout ansetzen?
 
Hallo Maik,

Danke schonmal für die Links :) Bei der Dropdown-Navigation ist jedoch immer noch das Problem, dass ich den Menüpunkten manuell die Breite geben muss. Der transparente Hintergrund erstreckt sich aber korrekt über das Untermenü. Gibt es da keinen anderen Weg, als die Breite fest anzugeben? Habe es schon mit overflow und so versucht, führte jedoch nicht zum Erfolg.

P.s: Ich darf dich leider nicht bewerten, muss erst noch jemand anderes bewerten, bevor ich wieder darf :)
 
In meiner Linkempfehlung werden für das Haupt- und Untermenü keine feste Breiten deklariert, sondern ergeben sich durch die Zeichenlängen.

mfg Maik
 
Jetzt klappt es wunderbar. Danke Maik, du warst mal wieder mein Retter in der Not :)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück