Adaptive Card using Container Queries
This card switches to a two-column layout when its own container is wide enough.
Fluid type, mobile-first breakpoints, container queries, and image helpers.
This card switches to a two-column layout when its own container is wide enough.
| Format | Best for | Notes |
|---|---|---|
| AVIF | Photos / highest compression | Great size savings; keep JPG fallback. |
| WebP | Photos & graphics | Excellent modern default. |
| SVG | Logos, icons, line art | CSS-themable, crisp at any DPI. |