Going beyond pixels and (r)ems in CSS – Container query length units – iO tech_hub
March 1, 2024
In the third part of this series, we’ll look at length units based on the container. Yes, you heard that right, we can finally get some measurements based on a containing element and that just spells awesome in my book. Currently available in all evergreen browsers, these units open up a lot of opportunities to create some smart systems and once again, I will write this up packed with a bunch of demos and cool use cases.
Source: Going beyond pixels and (r)ems in CSS – Container query length units – iO tech_hub
The third in an excellent series on units in CSS by Brecht De Ruyte.
Developers have long relied on pixels (or for the more responsive among us ems. and rems) but there are so many more that can make life easier and designs more sophisticated. So take take in the whole series, and pay special attention to container query units–like cqw–1 cqw (similar to vw) is 1% of the width of the containing element’s width-great for text that resizes based on the width of its containing element.