Html dropdown überlagert nicht andere Webseitenelemente

Bevor ich diese Frage gestellt habe, habe ich verschiedene Stack-Überlauffragen untersucht und implementiert, aber es hat nicht funktioniert.Html dropdown überlagert nicht andere Webseitenelemente

Bitte posten Sie diese Frage nicht als Duplikat.

Mein Problem ist, dass mein Dropdown nicht auf andere Elemente kommt.

ich den Code geschrieben haben, in jsfiddle

Hinweis: Bitte ziehen Sie das Ausgabefenster auf der die richtige Ansicht des Kopf

Im SCSS Fenster erhalten verlassen, Drop-Down-Benutzerprofil wird von Klasse navbarDropdown behandelt

.navbarDropdown { 
    float: right; 
    padding: 0px 10px; 
    position: relative; 

    img { 
    margin-top: -5px; 
    height: 40px; 
    } 

    ul { 
    background-color: $base-secondary-color; 
    padding: 4px 0; 
    position: absolute; 
    z-index: 999; 
    top: 30px; 
    left: 0; 
    width: auto; 
    border: none; 
    border-radius: 1px; 
    } 

    ul a { 
    height: 30px; 
    padding: 0 40px 0 10px; 
    display: block; 
    } 
}

Ich habe versucht Position: Absoulute und Z-Index.

Ich weiß nicht, wo der Fehler ist. Jede Hilfe wird geschätzt?

Quelle

2016-05-28 tumulr

so wollen Sie Logo, Menüleiste in der linken und Balance, Benutzerprofil und Fonds auf der rechten Seite hinzufügen. Wenn der Bildschirm klein ist, wird das rechte Panel in der zweiten Reihe sein, richtig? –

Ich habe die Responsive-Klassen nicht hinzugefügt. Ich musste nur wissen, warum das Dropdown nicht funktionierte. Aber jetzt arbeitet es nach Jasons Lösung. – tumulr

Der Grund dafür, dass Ihre Dropdown-Liste ausgeblendet ist, liegt darin, dass der Inhalt des Navigationselements ".navbar" überläuft. Hinzufügen des Überlaufs der CSS-Eigenschaft: visible; sollte das unmittelbare Problem beheben.

Quelle

2016-05-28 10:40:21

Vielen Dank. Es funktionierte. – tumulr

Html dropdown überlagert nicht andere Webseitenelemente

Antwort

Verwandte Themen