How to align list items?

Question

css

How can I align such a list in 3 columns?

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
     ........
</ul>

The height of the blocks can be different, as well as their number. With a question mark - a large block with a picture.
If you align using flex-flow: row wrap - if one of the row blocks is high, the next row will start where the largest block of the previous row ended.
The overall height of the list can also change, so flex-flow: column wrap and limiting the parent block to a height is also not suitable.

Answer 1

https://masonry.desandro.com/