AspectRatio
MediaConstrains content to a fixed width-to-height ratio
medialayoutratioresponsive
Demo
square · 1 / 1
video · 16 / 9
photo · 4 / 3
portrait · 3 / 4
wide · 21 / 9
Custom numeric ratio
AspectRatio reserves layout space before its content loads, so the page never jumps as images arrive.
Usage
import { AspectRatio } from '@classic-homes/theme-svelte';