Track

Explore the collection.

Item 1

A clear description of this item.

Item 2

A clear description of this item.

Item 3

A clear description of this item.

Item 4

A clear description of this item.

Item 5

A clear description of this item.

HTML

<div class="track-header block"><h2 class="like-h3">Explore the collection.</h2><div class="track-controls" data-track="example-track" hidden><button type="button" data-direction="-1" aria-label="Previous item">←</button><button type="button" data-direction="1" aria-label="Next item">→</button></div></div><div class="track is-medium" id="example-track" tabindex="0" role="region" aria-label="Example collection"><article class="card"><div class="content"><h3 class="like-h4">Item 1</h3><p>A clear description of this item.</p></div><figure class="figure is-fill"><img src="/assets/images/pattern-example.svg" width="800" height="500" alt="Mountains and sun"></figure></article><article class="card"><div class="content"><h3 class="like-h4">Item 2</h3><p>A clear description of this item.</p></div><figure class="figure is-fill"><img src="/assets/images/pattern-example.svg" width="800" height="500" alt="Mountains and sun"></figure></article><article class="card"><div class="content"><h3 class="like-h4">Item 3</h3><p>A clear description of this item.</p></div><figure class="figure is-fill"><img src="/assets/images/pattern-example.svg" width="800" height="500" alt="Mountains and sun"></figure></article><article class="card"><div class="content"><h3 class="like-h4">Item 4</h3><p>A clear description of this item.</p></div><figure class="figure is-fill"><img src="/assets/images/pattern-example.svg" width="800" height="500" alt="Mountains and sun"></figure></article><article class="card"><div class="content"><h3 class="like-h4">Item 5</h3><p>A clear description of this item.</p></div><figure class="figure is-fill"><img src="/assets/images/pattern-example.svg" width="800" height="500" alt="Mountains and sun"></figure></article></div>