Hallo,
ich beschäftige mich mal wieder mit display flex.
Hierzu habe ich eine Frage:
Mein DIV-Container, bestückt mit display:flex und einer 100%-Breite sowie 600px Höhe. Er soll seinen Inhalt als Spalten anzeigen, daher flex-direction:column, und er soll seinen Inhalt mehrzeilig anzeigen, bevor er zu eng gequetscht wird, daher flex-wrap:wrap.
Das klappt auch, und sieht auch - je nach Bildschirmgröße - ganz gut aus.
Allerdings ärgere ich mich ein bisschen darüber, dass meine 10 "Boxen" stets in 2 Reihen - also in jeder Reihe 5 Inhalte - aufgeteilt werden.
Mag sein, dass das Sinn dieser flex-Methode ist, aber bei so vielen Anpassungsmöglichkeiten müsste es doch auch hier was geben ...
Kann man bei dieser Einteilung nicht weitere Einstellungen treffen? Was ist, wenn der Benutzer sich das auf einem Smartphone mit kleinem Viewport ansieht? Hier würde ich bevorzugen, dass nicht je 5 Inhalte in einer Reihe angezeigt werden, sondern z. B. nur 3.
Oder gibt es hierfür eine besser geeignete Methode in CSS?
Nachtrag: Gut, ich könnte natürlich einfach per @media bei einer max-width von 800px oder so das column durch ein row ersetzen. Das werde ich nun mal testen.
Danke.
ich beschäftige mich mal wieder mit display flex.
Hierzu habe ich eine Frage:
Mein DIV-Container, bestückt mit display:flex und einer 100%-Breite sowie 600px Höhe. Er soll seinen Inhalt als Spalten anzeigen, daher flex-direction:column, und er soll seinen Inhalt mehrzeilig anzeigen, bevor er zu eng gequetscht wird, daher flex-wrap:wrap.
Das klappt auch, und sieht auch - je nach Bildschirmgröße - ganz gut aus.
Allerdings ärgere ich mich ein bisschen darüber, dass meine 10 "Boxen" stets in 2 Reihen - also in jeder Reihe 5 Inhalte - aufgeteilt werden.
Mag sein, dass das Sinn dieser flex-Methode ist, aber bei so vielen Anpassungsmöglichkeiten müsste es doch auch hier was geben ...
Kann man bei dieser Einteilung nicht weitere Einstellungen treffen? Was ist, wenn der Benutzer sich das auf einem Smartphone mit kleinem Viewport ansieht? Hier würde ich bevorzugen, dass nicht je 5 Inhalte in einer Reihe angezeigt werden, sondern z. B. nur 3.
Oder gibt es hierfür eine besser geeignete Methode in CSS?
Nachtrag: Gut, ich könnte natürlich einfach per @media bei einer max-width von 800px oder so das column durch ein row ersetzen. Das werde ich nun mal testen.
Danke.
