0

I'm trying to achieve a layout of 2 or more columns that are based on the number of elements instead of fitting based on their sizes

enter image description here

This question has been asked a few years back but never answered: CSS columns - expand one element without rearranging

The only solution I can find would be to make a JS that counts the children and wraps them in different columns

Is there any other solution that doesn't require JS?

PS: I just wished for a column-element-count property For the scenario in the picture the code would look like this: .list { column-element-count: 4 5 4; }

Infinity Atom
  • 21
  • 3
  • I don’t understand hoe your first diagram was obtained with CSS as the middle column is shorter than the third one. Can you show us a runnable example. See https://stackoverflow.com/help/minimal-reproducible-example – A Haworth Feb 27 '23 at 00:32

0 Answers0