Layout / reel

reel

Tier 0

Horizontal scroll with snap. Scrolling is the browser's; snap is CSS.

slide 1

slide 2

slide 3

slide 4

slide 5

slide 6

<m-reel gap="md" snap="mandatory" tabindex="0" role="region" aria-label="screenshots">…</m-reel>

Attributes

gap; snap: none · mandatory (default proximity).

Markup contract

A scrollable region must be keyboard-reachable — CSS cannot confer focusability, so the recipe carries it: tabindex="0" plus an accessible name (role="region" aria-label="…"). Without it, keyboard users cannot scroll the reel in some browsers.