Horizontales Menü im Bootstrap-Grid vertikal machen
Hallo Experten,
ich brauche mal einen Denkanstoß zu folgender Problematik. Ich habe auf meiner Seite ein horizontal angeordnetes Menü innerhalb eines Bootstrap-Grids. Jetzt möchte ich realisieren, dass sich das horizontale Menü in ein ein vertikal angeordnetes Menü "verwandelt", sobalr ich mich im Bereich der kleinen Geräte (col-xs) befinde. Wie muss ich das anstellen? Gruß, Berndi |
Das erledigt doch Bootstrap automatisch für Dich.
Schieb mal die Seite zusammen, dann siehst was passiert. Wenn Du das schon früher oder anders haben willst, musst das mit den media Querys anders anlegen. Tryit Editor v3.3 |
Hallo und danke für die Antwort.
Mein Code siht folgendermaßen aus: Code:
<nav id="tgs-2ndnav" class="wrap navbar navbar-default tgs-2ndnav"> http://tgschwalbach.de/pics/horizontalesMenue2.jpg Ich tippe ja auf einen "verbogenen" CSS-Eintrag, weiß aber nicht wonach ich Ausschau halten soll. |
nav-stackable bedeutet, dass sie immer und nicht erst ab einer gewissen Größe untereinander sind.
Components · Bootstrap Das was du suchst wird nicht von Haus aus angeboten, da musst du ab deiner gewünschten Größe ein mediaquery schreiben, welches dir die Pills "stacked", also auf float:none setzt. Auch dürfte dein CSS etwas überschreiben, deine Navigation sieht nicht "stacked" aus. Fügt man deinen HTML code zB auf der bootstrap Seite ein (dort ist ja das bootstrap css vorhanden) dann wird sie korrekt untereinander dargestellt. |
Wir würde so etwas konkret aussehen?
|
Wie würde "was" konkret aussehen?
|
Das Media-Query.
Ich suche mir einen Wolf nach dem CSS-Fehler, warum das nav-stacked nicht stacked ist. Ich finde nix. |
Code:
@media (min-width: 768px){ |
Lässt sich das irgendwie auch mit einer ID koppeln, dass dieses Query ausschließlich dafür gilt?
|
Okay, habe der Fehler gefunden.
Habe in meiner Stylesheet diesen Eintrag gefunden: Code:
#tgs-2ndnav li {display: inline;} Jetzt muss ich wohl herausfinden, die ich dem Joomla-Menümodul beibringe nicht die "nav-stacked" Klasse zu übergeben ... *grübel* |
Alle Zeitangaben in WEZ +2. Es ist jetzt 14:37 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023