Bootstrap 3 – vertikale Ausrichtung des Navigationsleisteninhalts
-
21-12-2019 - |
Frage
http://www.bootply.com/tfGjhlJnPL
Ich versuche, die rechtsbündigen Navigationselemente vertikal am unteren Rand des linksbündigen Bildes auszurichten.
Ich möchte auch, dass die Umschalttaste der Navigationsleiste auf die gleiche Weise am unteren Rand des Bildes ausgerichtet ist, wenn die Navigationsleiste ausgeblendet ist ...
Alle Vorschläge willkommen :)
Lösung
Nun, wenn Sie nicht dagegen sind, können Sie dies hauptsächlich mit Hilfe erreichen position:absolute
.Basierend auf Ihren aktuellen Stilen würde beispielsweise dieses CSS funktionieren:
.navbar-header{
position:relative;
}
@media (max-width: 991px) {
.navbar-toggle{
position:absolute;
right:0;
bottom:0;
}
}
@media (min-width: 991px) {
.navbar-nav{
position:absolute;
right:0;
bottom:0;
}
}
Hier ist ein Bootply aktualisiert um Ihnen zu zeigen, was damit erreicht wird.Abhängig von Ihren Vorlieben möchten Sie möglicherweise auch die einzelnen Elemente anpassen padding
oder margin
um zu ändern, wie nahe es am unteren Rand des Kopfbereichs liegt (ich habe diese Stile in meiner Demo nicht geändert).Hoffe das hilft!Lassen Sie mich wissen, wenn Sie Fragen haben.