Navigation mit Flexbox zu breit für Smartphones.

[marctrix]

Hej fbube,

es kommt drauf an, wie das Ergebnis sein soll.

Grundsätzlich ist es empfehlenswert mit der Smartphone-Darstellung (also einspaltig) zu beginnen.

Einen Tipp, wie du Flexboxen dazu bringst, automatisch umzubrechen, hast du ja schon bekommen:

flex-wrap: wrap;

Vielleicht möchtest du aber mehr Kontrolle. Wenn alle List-Items untereinander stehen sollen, erreichst du das, indem du die y-Achse als Hauptachse festlegst:

flex-direction: column;

Für große Bildschirme kannst du dann statt column den Wert wieder auf den Standard zurück setzen.

Obwohl der Artikel im Wiki zu Flexbox gut ist, würde ich dir auch mal einen Blick auf den Conplete Guide to Flexbox empfehlen. Dort ist zu jeder Eigenschaft und allen werten ein Bild bereit gestellt, dass die Auswirkungen zeigt. Zum üben sei noch das obligatorische Flexbox froggy empfohlen.