Bootstrap Dropdown Menü öffnet außerhalb des Bildschirms?
Hi, ich habe auf meiner Website ein Bootstrap Dropdown Menü eingebaut. Dieses befindet sich links am Bildschirmrand. Wenn ich drauftippe, öffnet es sich so, dass die Schrift außerhalb des Bildschirm ist, man das menü also nur zur Hälfte sehen kann. Wie kann ich den Code hier verändern, damit Bootstrap weiß, dass es das menü nicht nach links sondern nach rechts öffnen soll.
Der Code:
<div class="dropdown">
<button class="btn btn-secondary btn-success px-3" type="button" id="dropdownMenuButton1"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="fas fa-bars"></i>
</button>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuButton1">
HIER SIND DIE EINZELNEN LISTENELEMENTE!!!
</ul>
</div>
Da das Problem schwer zu erklären ist, kann gerne auch unter meiner GuteFrage profil Seite auf meine Website gehen und auf den Menübutton drücken. Man meine website dann nur auf einem handy oder so öffnen, da sonst der Bildschirm groß genug für das Menü wäre.
Danke für jede Hilfe!!
1 Antwort
Entferne die Klasse dropdown-menu-end von deinem ul-Element. Das gilt sowohl für Desktop als auch für mobile Größen, denn das Problem tritt in beiden Fällen auf.
Mehr zur Ausrichtung von Menüs findest du in der Bootstrap-Dokumentation.
