Every few months I go back through an old project and find a chunk of JavaScript solving a problem that CSS now solves on its own — a resize listener recalculating an aspect ratio, a scroll handler smoothing out anchor links, a canvas hack blurring a background. None of it was bad code when it was written. It's just that the platform quietly caught up, and the JavaScript never got removed.
Here are ten CSS properties that, between them, have deleted a genuinely large amount of JavaScript from my projects — grouped by what they actually replace, not just listed in isolation.
Sizing and layout
aspect-ratio
Keeping an image, video, or placeholder box at a fixed proportion used to mean either padding-hack tricks (padding-top: 56.25% and a positioned child) or a resize listener recalculating a pixel height on every viewport change:
