So brechen Sie die Zeile ("clear" -Element) in css flexbox

7

Ist es möglich, das Element in einem "display: flex" -Container zu löschen?

Ich möchte so etwas erreichen:

  • 20 Elemente hintereinander auf einem großen Bildschirm
  • 10 Elemente in einer Reihe auf einem kleineren Bildschirm
  • 5 Elemente in einer Reihe auf einem kleinen Bildschirm

Mit Floats konnte ich nach jedem fünften Element mit entsprechenden Medienabfragen "räumen" ...

    
Sqrcz 26.03.2015, 14:15
quelle

2 Antworten

21

Sie können flex-wrap: wrap; zum Container hinzufügen und die Breite der Elemente festlegen.

Dann sollten Sie das Steuerelement haben, um zu entscheiden, welche Elemente das Floating stoppen wird.

Demo: Ссылка

    
paolo pieretto 14.09.2015 13:52
quelle
3

Sie können versuchen, den Elementen im Container neben der Eigenschaft flex-wrap: wrap eine width mit Prozentsätzen hinzuzufügen. Dann manipulierst du mit einer Medienabfrage die Breite dieser Elemente, die einen Bruchpunkt haben. Hier ist ein Beispiel:

%Vor% %Vor%
    
César Alberca 15.09.2016 10:55
quelle

Tags und Links