Der Inhalt der Dropdown-Menüs befindet sich standardmäßig unten rechts.
Gibt es eine Möglichkeit, es so einzustellen, dass es nach links unten geht?
(Fundament 5)
Der "richtige" Stil wird über JS angewendet. Um dies zu überschreiben, geben Sie #contentDrop
einen Stil von #contentDrop{left: -100px !important;}
oder den Wert ein, den Sie nach links ziehen möchten. Sie müssen die Styles .f-dropdown:after{left:XXpx !important;}
und .f-dropdown:before{left:XXpx !important;}
anpassen, um das kleine Dreieck rechts neben der Dropdown-Box zu platzieren.
Das ist ein Hack, weil die Zurb-Foundation noch an einer Lösung für dieses Problem arbeitet. Es gibt ein github-Problem , das damit zusammenhängt. Ich habe einen Hack hier gefunden, der mir geholfen hat, ihn zu lösen.
Mithilfe dieser Informationen können Sie die Ausrichtung korrigieren. Fügen Sie eine Klasse bottom-align-left
zum Inhalts-Dropdown-Menü div
:
Fügen Sie das dann Ihrer CSS- oder SCSS-Datei hinzu. Sie müssen mit der Nummer spielen, um es richtig zu machen.
%Vor%Jetzt erscheint das Dreieck an der falschen Stelle. Um dies zu beheben, entfernen Sie das Dreieck.
_settings.scss
. $f-dropdown-triangle-size
und setze es auf 0px
, d. h.
%Code%
Tags und Links zurb-foundation