Wie man ein drop-down-Menü, um andere Elemente überlagern
Erstelle ich eine kleine website und ich kann nicht die drop-down-Menü, das kommt aus der "Galerie" - button, wenn ich bewegen Sie die Maus über es, zu überlagern, den Absatz unter der Menü anstatt sich den gesamten Inhalt hinunter. Ich habe bereits versucht, jede Kombination von position: relative; z-index: 9999;
. Allerdings, wenn ich position: absolute;
für die <ul>
element es funktioniert tatsächlich, aber versaut das layout der <ul>
Elemente. Bitte helfen Sie mir, dieses zu erhalten getan, weil ich beginne zu stoßen, mein Kopf... Hier ist mein code. Sie können sehen, wie der Absatz geht nach unten, wenn Sie die Maus auf den "Galerie" - button. Ich Wünsche der paragaph blieb wo es ist und die drop-down-Menü überlagert es.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Erste position des übergeordneten Elements als
relative
zu machen Schaffung eines neuen, mit block für absolut positionierte Nachkommen:Positionieren Sie anschließend die verschachtelte
<ul>
absolut, fügen Sietop
,left
offsets sowiewidth
:Beispiel Hier
left: 0; top: 100%; width: 100%;
Eigenschaften! Danke nochmals!!!top: 100%
Eigenschaft macht die<ul>
schön-layout unter die<a>
element? Von der ersten dachte, es scheint, dass, sollte es die<ul>
zu erscheinen direkt in der Nähe des oberen Rand des container -, aber zum Glück ist es nicht der Fall, denn ich brauche es richtig unter die<a>
element.absolute
oderfixed
—top
- Eigenschaft gibt den Abstand zwischen dem oberen Rand des Elements und der Obere Rand des Elements enthaltenden block. Auch einen prozentualen Wert auftop
ist relativ zu derheight
des enthaltenden Blocks. Daher kann man durch Einstellungtop
zu100%
können wir sicherstellen, dass das element positioniert werden soll, unter der Sie enthaltenden block.top
- Eigenschaft auf 100% zwingen wir die Lücke zwischen dem element und seinen Behälter so groß wie möglich sein, denn 100% bedeutet, dass die gap sollte sich über die gesamte Höhe des Behälters. Richtig?Müssen Sie Ihre .Menü-Element eine relative position
und jetzt können Sie Ihre
ul
zuabsolute
position, ohne in Unordnung zu Ihrem layout.Hier ist eine aktualisierte version der fiddle
ul
. Sie müssen es Stil.<ul>
vermasselt nach der Einstellung derposition: absolute;
Eigenschaft. @Hashem Qolami gab mir nur, was ich wirklich brauchte. Sorry, aber sein Beispiel war ein bisschen besser, aber ich danke Ihnen auch!Funktioniert nicht auf frame-baut..
Beispiel: Sie haben zwei Rahmen, oben mit Inhalt in Ihnen, und Sie haben eine CSS-dropdown-Menü am oberen Rahmen. Wenn Sie auf das Menü, das Untermenü ist nicht sichtbar vor der content-Seite.