Aspect ratio

Sets the ratio through --hui-aspect-ratio and crops whatever is inside it. Its job is to reserve the space before the content arrives, so a late image does not push the page around.

Square and widescreen

The default is 16 / 9. A direct child is stretched to fill the box and cropped with object-fit: cover.

.hui-aspect-ratio

Keeps a box at a ratio. Set --hui-aspect-ratio; default 16 / 9.

<div class="hui-aspect-ratio"><img src="…" alt="…" /></div>