I think I'm quite late on this one. It's been around since 2018.

What does it do?

With this, the element don't produce a box by itself. It's replaced by a shadowbox and the box of its children.

From my understanding, it removes the box of the elements from the rendering. The element is still here with its children but the container doesn't behave like if it had a display: block; or something else.

Is it useful ?

In my case yes. As I said in my previous article I added this to the div that is generated in the backend that contains my blog post content.

I needed to do so to remove the container box and allow the children to use the full capabilities of the grid layout I'm using.

I still had to re-specify the grid-column: main; to all its children, otherwise they would display on the different parts of the grid which I don't want.

Another note

I setup analytics on this blog, so I know how many of you visit me. I decided to self-host Plausible. I won't be tracking you, I have better things to do.