Daily Software Tips & Tricks

Bite-sized knowledge to improve your coding skills daily.

Stop Fighting with Responsive Squares

March 23, 2026

Remember the old padding-top hack to keep video containers at a specific ratio? Those days are finally over. Modern browsers now support the aspect-ratio CSS property. Just set "aspect-ratio: 16 / 9" (or 1 / 1 for a perfect square) on your element, and it will maintain its proportions regardless of the width. It’s much more readable and saves you from doing weird math in your stylesheets.