Filling empty space with floating blocks. Analysis of 2 implementation examples. From Yandex and from Lebedev Studio.

Recently I encountered the problem of selling floating blocks in one online store. The bottom line is that goods are displayed in blocks. As planned, the number of horizontal blocks should vary depending on the screen resolution. It was not possible to use float stupid due to the not fixed block height.
A little googling, I did not find anything. But he remembered that he had seen similar on Yandex and in the store of Lebedev's studio.
Actually, I am posting here for review what you yourself can find in the indicated sources. All that I did was cleaned from unnecessary code. If I had found a similar post before it would save me time.


Each of these methods has its own advantages and disadvantages. Let's see:

Example from Yandex and source
+ There is no restriction on the height of the block
+ Fills all the empty space
- Uses a fairly large javascript
- Tables are used

Example from Lebedev's studio and source (Thanks for the comments left)
+ Without javascript
+ No tables
- Does not fill the empty space when it is not enough for a new block
- Strict restriction on the height of the block

If you know other interesting examples - write. I will replenish the collection.