AllTips(154)

css/Maintaining Square Proportions

Maintaining Square Proportions

Name: Maintaining Square Proportions
Uploaded: 2024-01-10T20:05:13+08:00
Channel: Arbaoui Mehdi
Description: Use the CSS `aspect-ratio` property to consistently create a perfect square, ensuring the element maintains its proportions across different screen sizes.

Next Tip

Project Source Code https://github.com/Front-Tips/maintaining-square-proportions
MDN CSS aspect-ratio Reference https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio
Geoff Graham Credits https://geoffgraham.me/