finds.dev← search

// the find

philipwalton/responsive-components

★ 581 · JavaScript · Apache-2.0 · updated Jun 2024

A modern approach to styling elements based on the size of their container

A ResizeObserver-based polyfill for container queries, written before the CSS spec landed natively. It uses class toggling on elements to apply container-aware styles. Interesting primarily as historical documentation of the problem and one pre-spec solution.

The accompanying article explains the container query problem clearly and is still worth reading. The demo site shows real-world use cases (cards, calendars, galleries) that make the concept concrete. The implementation is lightweight — no framework, just ResizeObserver and class manipulation.

Native CSS container queries shipped in all major browsers in 2023, making this approach obsolete for any new project. The repo hasn't been meaningfully updated since 2019 despite the 2024 touch; it's effectively archived. The build system is Gulp with a Node 12-era dependency tree that likely won't install cleanly on modern Node. There's no migration path or note pointing users toward the CSS-native approach.

View on GitHub → Homepage ↗

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →