For those wondering why not just use CSS Grid -- it's not build for that[0] (see @rachelandrew's comment). It's not explained on the repo README but the author goes into it on the explanation blog post. As mentioned, Masonry[1] is the other famous library for doing this. Magic Grid also has a Vue port[2] if you're into that. [EDIT] - PR just got merged, explanation of this stuff is on the Github README now [0]: https…
Although I've read through the "css grid isn't meant to do this details", you can get fairly close to this with pure css grid, see here: https://github.com/wesbos/css-grid/blob/master/20%20-%20CSS%...
Here's the JSfiddle for that demo:
https://jsfiddle.net/cbjzped2/
The problem with that is that the grid rows are determined dynamically:
.item.v2 {
grid-row: span 2;
}
.item.v3 {
grid-row: span 3;
}
.item.v4 {
grid-row: span 4;
}
.item.h2 {
grid-column: span 2;
}