|
|||
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 |
Sponsored Links |
|
|||
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 |
Sponsored Links |
|
|||
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"> <div class="container-fluid"> <div class="moduletable jmoddiv jmodinside" data-jmodediturl="https://tgschwalbach.de/joomla/index.php?option=com_config&controller=config.display.modules&id=454&return=aHR0cHM6Ly90Z3NjaHdhbGJhY2guZGUvam9vbWxhL2luZGV4LnBocC9vdGhlci1wYWdlcy92b2xsZXliYWxs" data-target="_self" data-jmodtip="<strong>Modul bearbeiten</strong><br />Abteilungsmenü - Volleyball<br />Position: 2ndmenu" style=" "> <ul class="nav nav-pills nav-stacked "> <li class="item-1348"><a href="/joomla/index.php/berichte-volleyball">Berichte aus der Volleyball-Abteilung</a></li> <li class="item-1355"><a href="/joomla/index.php/historie">Historie</a></li> <li class="item-1356"><a href="/joomla/index.php/volleyball-rekorde">Rekorde</a></li> <li class="item-1357"><a href="/joomla/index.php/outdoor-wochenenden">Outdoor-Wochenenden</a></li> <li class="item-1396"><a href="/joomla/index.php/other-pages/volleyball/beach-volleyball">Beachvolley</a></li> <li class="item-1349"><a href="/joomla/index.php/abteilungsleitung-volleyball">Abteilungsleitung</a></li> </ul> </div> </div> </nav> Ich tippe ja auf einen "verbogenen" CSS-Eintrag, weiß aber nicht wonach ich Ausschau halten soll. Geändert von Berndi (08.02.2017 um 13:18 Uhr) |
|
|||
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. |
|
|||
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* |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
horizontales Menü in horizontales Pulldown-Menü ändern | Stephan1958 | CSS | 5 | 11.01.2012 14:37 |
Vertikales submenue in horizontales mainmenue einbinden | susigeha | CSS | 7 | 25.02.2011 09:20 |
horizontales Menü mit Subemenü ohne Listenelemente aber mit Grafiken | metalmarder | CSS | 4 | 21.02.2009 21:38 |
In horizontales Menü dropdown einbinden | Star_Scream | CSS | 1 | 14.10.2008 14:45 |
[gelöst] Horizontales Dropdownmenu mit Unterordnern | sui | CSS | 5 | 27.10.2005 19:51 |