On March 7, 2023, I learned...

Body styles are ignored when the changing the default containment of body or HTML root

I thought I’d cook up a quick demo of diddling container queries. I figured I could define the body as a container and style the heading element I was working on based on the body’s inline size. I know, I know… why the heck would I even want to do something like that when we have media queries and length units that are already tied to the viewport. It was just bone-headed tomfoolery.

But it yielded today’s learning lesson: body styles are ignored when it’s defined as a container.

Turns out that’s expected behavior. My blonde brain finds it tough to grok the reasoning, but it appears to be that a change in body size is really a change in viewport, and because of that:

On body, since it’d change the viewport, it can affect the layout of the element itself. Same thing for writing-mode. Disabling that is a good thing to have.

Florian Rivoal, W3C CSSWG Working Drafts, Issue #5913

That makes sense! And I doubt there are going to be dorks like me trying to change default containment on the body. I mean, who the heck would even try that?!

Oh, right.



  • Jonathan Dallas
  • Tyler Sticka

Leave a Reply

Markdown supported