Ich möchte ein Layout erreichen, bei dem ein Element (in meinem Fall ein <ul> ) auf 2 (oder mehr) Spalten erweitert wird, wenn die Höhe eine bestimmte Grenze erreicht.
Wenn zum Beispiel die Höhe nur für 3 Elemente ausreicht und ich 5 habe, wechseln das 4. und 5. Element zur zweiten Spalte, die nur bei Bedarf erstellt wird.
Ich habe versucht, dies zu tun, indem ich die max-height wie vorgeschlagen festlegte hier mit column-count und column-width auf auto gesetzt über columns (Ich habe versucht, sie auch separat zu setzen, dasselbe Verhalten).
Wenn ich andererseits column-count in eine feste ganze Zahl ändere, funktioniert es und gleicht die Elemente aus, aber das ist nicht dynamisch, wie ich es brauche. (Wenn ich nur 2 Elemente habe, möchte ich keine 2 Spalten für sie erstellen).
Gibt es eine Möglichkeit, die Höhe festzulegen und die Spalten automatisch hinzuzufügen, wenn die Höhe nicht für alle Elemente ausreicht?
Um CSS-Spalten arbeiten zu können, müssen Sie zuerst column-width oder column-count setzen. CSS-Spalten funktionieren nicht , wenn Sie keine davon festlegen.
Wenn ich richtig verstanden habe, müssen Sie die Spalte füllen -Eigenschaft verwenden . Leider unterstützt nur Firefox es jetzt. Sehen Sie sich dieses Code-Snippet an ( Nur Firefox ).
Ich denke, Sie könnten in Ihrem Fall flex verwenden. Siehe Beispiel :
Tags und Links html css css3 multiple-columns