จัดสัดส่วนด้วย aspect-ratio

CSS สำหรับจัดการสัดส่วนรูปภาพหรือพื้นหลัง

ตัวอย่างโค้ด HTML

<div class=”box”>I am a perfect square</div>

ตัวอย่างโค้ด CSS สำหรับสัดส่วน 1:1

.box {
aspect-ratio: 1/1;
}

ตัวอย่างการแสดงผล

codepen

ที่มา

smashingmagazine