Using Container Query Units Relative to an Outer Container
Container units (e.g. cqi) are only able to reference the closest container. But if you register a custom property and set that higher up, you can get your hands on other containers units.
Container units (e.g. cqi) are only able to reference the closest container. But if you register a custom property and set that higher up, you can get your hands on other containers units.
Victor Ayomipo saw our post about using container units for everything. He was more optimistic than I that our result was good. My thinking is that there are plenty of things you straight up don’t want to use container units for. Victor did a similar exercise with (over?)-using min() and viewport units. Turns out there […]
I said to myself I said what if I used container units for every single unit in a design? I was wondering, partially because I thought the answer might be well, everything will probably scale really nicely then. Container units, in case you haven’t heard of them, are unit (like px or rem, but more […]
Container queries are similar to media queries but allow you set styles based on a particular element’s current size, typically the width. This is super handy because you can write CSS in a way that gives flexibility to the layout! With @media queries, there’s a tight coupling of the styling of a component’s content and […]
Frontend Masters Donates to open source projects. $363,806 contributed to date.