Here's a quick responsive clover layout on @codepen https://codepen.io/thebabydino/pen/RNwmjEQ?editors=0100

Little @codepen demo: stacked avatars https://codepen.io/thebabydino/pen/ogNQryV

Pure #CSS and very little of it, just some #flexbox magic.

Self Gap, by @shadeed9:

https://ishadeed.com/article/self-gap/

Ever wanted to get the number of auto-fit columns in CSS?

```
--u: 5em;
grid-template-columns: repeat(auto-fit, minmax(var(--u), 1fr))
```

It's now possible! Using registered #CSS vars, the tan division hack and container query units! Here's a little test on @codepen:
https://codepen.io/thebabydino/pen/JojpBJr

Flexy flex layout for any number n of items such that we have:

at most 3 items on a row
at least 2 items on a row IF we have at least 2 items in total

In only 5 (display, flex-wrap, gap, flex and flex-basis override) CSS declarations, working for any number n of items!

Because someone asked for this on reddit https://www.reddit.com/r/css/comments/1jayx5v/comment/mhq2ldw/

Here is the @codepen demo https://codepen.io/thebabydino/pen/OPJOepJ