> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/triumph/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/triumph/template/sections/media-horizontal-scroll.md).

# Media horizontal scroll

Displays media in a row that users can scroll through horizontally.

*Shared Settings*:

* [<mark style="color:$primary;">Media</mark>](#media)
* [<mark style="color:$primary;">Section layout</mark>](/triumph/template/shared-settings/section-layout.md)
* [<mark style="color:$primary;">Section mobile layout</mark>](/triumph/template/shared-settings/section-mobile-layout.md)
* [<mark style="color:$primary;">Divider line</mark>](/triumph/template/shared-settings/divider-line.md)
* [<mark style="color:$primary;">Section background</mark>](/triumph/template/shared-settings/section-background.md)
* [<mark style="color:$primary;">Colors</mark>](#colors)

*Shared Blocks:*

* [<mark style="color:$primary;">Heading</mark>](/triumph/template/shared-blocks/heading.md)
* [<mark style="color:$primary;">Button</mark>](/triumph/template/shared-blocks/button.md)
* [<mark style="color:$primary;">Media</mark>](/triumph/template/shared-blocks/media.md)

***

**Reverse scroll direction**\
Changes the direction the media moves across the screen.

**Scroll speed**\
Controls how fast the media moves:

* **Slow** – Gentle scrolling speed.
* **Medium** – Balanced scrolling speed.
* **Fast** – Quicker scrolling movement.

**Reduce media scale on desktop**\
Makes media items appear smaller on desktop screens when scrolling (0-50%).

**Gap on desktop**\
Controls the spacing between media items on desktop screens (10-200%).

***

#### Media

**Height on desktop**\
Sets the height of media items on desktop screens (300-800 px).

**Height on mobile**\
Adjusts the media height for mobile devices (200-350 px).

***

{% tabs %}
{% tab title="Desktop" %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FvlfHnQiBKLE1iM9Jqyxs%2Fmedia%20horizontal%20scroll_desktop.png?alt=media&amp;token=9ab4c0b3-dbde-430c-8e61-e6e20600dcae" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2Fo8FW67qduXczW1EweERd%2Fmedia%20horizontal%20scroll_mobile.png?alt=media&amp;token=98953924-86d2-49fe-80a8-43b4abd73657" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}