Supporting demos for Stephanie Eckles' presentation at Web Directions: Hover 2022.
Demos
These demos use the container queries polyfill from Google ChromeLabs and will likely work in your selected browser.
Known upcoming syntax changs that may affect demo functionality:
- The spec has removed
size
as a requirement. However, thesize
designation is currently required for demos to work in Chrome Canary, which is presently the best supported browser without the polyfill. - The spec intends for container relative units to have a prefix of "c" but that is not supported in Canary, so the fluid typography demo uses
qi
which may break when support is updated tocqi
.
Additional Resources
Some resources may include outdated syntax using the contain
property to create containers.