Czy wiesz, czym jest aspect-ratio i jak go używać?

Niedawno w przeglądarkach pojawiło się wsparcie dla nowego atrybutu w CSS - aspect-ratio
(caniuse). Jak nazwa sugeruje, służy on do określania proporcji elementu.
Przyjmuje on dwa parametry oddzielone ukośnikiem:
aspect-ratio: 1 / 2;
Określa on stosunek wysokości do szerokości obiektu. Dla podanego wyżej przykładu, jeżeli wysokość ustawimy na 100px to szerokość automatycznie ustawi się na 50px. Jeżeli w stylu zdefiniujemy wysokość i szerokość, wtedy atrybut aspect-ratio
zostanie zignorowany.
Poniżej przykład, na którym można zaobserwować działanie omawianego parametru: https://codepen.io/Porkite/pen/xxPqyzR
💡 "Czy wiesz, że?" to wewnątrzfirmowa inicjatywa, której celem jest szerzenie ciekawostek
z różnych obszarów IT. Najlepsze z nich trafiają na bloga dla szerszego grona odbiorców.