---
title: How to Use Nested Scroll Tiles in Builder 2.0
description: Nested scroll functionality reintroduced to enable layered scrolling compositions for richer interactive layouts
---

[Skip to content](https://support.tiled.co/nested-scroll-tile-returns#main-content)

English

Show submenu for translations

[Submit a request](https://support.tiled.co/kb-tickets/new)

![logo-horizontal\_w.png\]](https://support.tiled.co/hs-fs/hubfs/logo-horizontal_w.png?height=30&name=logo-horizontal_w.png)

Open main navigation

Close main navigation

- English
  
  Show submenu for translations
- [Submit a request](https://support.tiled.co/kb-tickets/new)

 Hi, how can we help you?

- There are no suggestions because the search field is empty.

1. [Support](https://support.tiled.co/)
2. [New Releases](https://support.tiled.co/new-releases)
3. [v52.0.0](https://support.tiled.co/new-releases#v52-0-0)

# How to Use Nested Scroll Tiles in Builder 2.0

## This guide explains how to create layered scrolling layouts by placing a scroll tile inside another scroll tile — enabling each container to scroll independently along its own axis.

### Overview

A **Nested Scroll Tile** is a scroll container placed inside another scroll container. The inner and outer containers scroll independently within their own boundaries, allowing you to build richer interactive layouts where different parts of the microapp move separately.

> **Note:** Nested Scroll Tiles are available in Builder 2.0 only.

---

### How It Works

Each scroll container — inner and outer — scrolls independently. They can be configured with different scroll directions, so, for example, the outer container can scroll vertically while the inner container scrolls horizontally. The viewer controls each axis separately as they interact with the microapp.

---

### How to Create a Nested Scroll Layout

1. Add a **Scroll Tile** to your canvas in Builder 2.0 — this becomes your outer scroll container.
2. Inside the outer Scroll Tile, add another **Scroll Tile** — this becomes your inner scroll container.
3. Set the scroll direction for each container independently in the **Properties** panel.
4. Add content tiles inside each scroll container as needed.
5. **Preview** your microapp to confirm each container scrolls as intended.

> **Tip:** Test your nested layout at different viewport sizes in Preview to make sure both scroll axes behave as expected across device types.

---

### Design Patterns

Nested Scroll Tiles enable layouts that aren't possible with a single scroll container:

| Pattern | How to set it up |
| --- | --- |
| **Horizontal product carousel inside a vertical page** | Outer scroll: vertical. Inner scroll: horizontal. Place product tiles inside the inner container. |
| **Fixed sidebar with scrollable content panel** | Outer scroll: vertical for main content. Inner scroll: vertical, constrained to the content panel area. |
| **Multi-panel dashboard** | Multiple inner scroll containers side by side, each scrolling independently within its section. |

---

### Common Questions

**Can inner and outer scroll containers have different scroll directions?**  
Yes — each container's scroll direction is set independently. A common pattern is an outer vertical scroll with an inner horizontal scroll for a carousel effect.

**Is Nested Scroll Tile available in Builder 1.0?**  
No — Nested Scroll Tiles are a Builder 2.0 feature only.

**My nested scroll layout isn't detecting the correct scroll direction automatically — what should I check?**  
Make sure horizontal automatic direction detection is enabled for the relevant scroll container. If the inner container is set to auto-detect direction and is defaulting to vertical, check the scroll direction setting in the Properties panel and set it explicitly if needed.

**Can I nest more than two levels of scroll containers?**  
Test your specific layout in Preview — deeply nested scroll configurations may behave differently depending on layout complexity. Start with two levels and validate before adding more.

- [Getting Started](https://support.tiled.co/getting-started#main-content)

    - [Intro to Tiled](https://support.tiled.co/getting-started#intro-to-tiled)
    - [Tiled Library](https://support.tiled.co/getting-started#tiled-library)
- [Tiled Builder](https://support.tiled.co/tiled-builder#main-content)

    - [Tiled Builder](https://support.tiled.co/tiled-builder#tiled-builder)
    - [Microapp Tiles](https://support.tiled.co/tiled-builder#microapp-tiles)
    - [Personalization](https://support.tiled.co/tiled-builder#personalization)
    - [Asset Library](https://support.tiled.co/tiled-builder#asset-library)
    - [Best Practices](https://support.tiled.co/tiled-builder#best-practices)
- [Tiled Tiles](https://support.tiled.co/tiled-tiles)
- [Settings](https://support.tiled.co/settings#main-content)

    - [Account Settings](https://support.tiled.co/settings#account-settings)
    - [Library Settings](https://support.tiled.co/settings#library-settings)
    - [Microapp Settings](https://support.tiled.co/settings#microapp-settings)
- [Sharing & Analytics](https://support.tiled.co/sharing-analytics#main-content)

    - [Microapp Analytics](https://support.tiled.co/sharing-analytics#microapp-analytics)
    - [Personalization](https://support.tiled.co/sharing-analytics#personalization)
    - [Sharing Microapps](https://support.tiled.co/sharing-analytics#sharing-microapps)
- [Useful Resources](https://support.tiled.co/useful-resources#main-content)

    - [Additional Guides](https://support.tiled.co/useful-resources#additional-guides)
    - [Developer Tools](https://support.tiled.co/useful-resources#developer-tools)
    - [Accessibility](https://support.tiled.co/useful-resources#accessibility)
    - [Tiled Mobile App](https://support.tiled.co/useful-resources#tiled-mobile-app)
    - [Seismic](https://support.tiled.co/useful-resources#seismic)
    - [Authentication & Security](https://support.tiled.co/useful-resources#authentication-security)
- [Builder 2.0](https://support.tiled.co/builder-2-0#main-content)

    - [Tiled Builder 2.0](https://support.tiled.co/builder-2-0#tiled-builder-2-0)
    - [Microapp Tiles 2.0](https://support.tiled.co/builder-2-0#microapp-tiles-2-0)
    - [Personalization 2.0](https://support.tiled.co/builder-2-0#personalization-2-0)
    - [Asset Panel 2.0](https://support.tiled.co/builder-2-0#asset-panel-2-0)
    - [Layers & Settings 2.0](https://support.tiled.co/builder-2-0#layers-settings-2-0)
    - [FAQ](https://support.tiled.co/builder-2-0#faq)
- [Tiled Plugins](https://support.tiled.co/tiled-plugins#main-content)

    - [Figma Plugin](https://support.tiled.co/tiled-plugins#figma-plugin)
    - [Adobe XD Plugin](https://support.tiled.co/tiled-plugins#adobe-xd-plugin)
    - [Sketch Plugin](https://support.tiled.co/tiled-plugins#sketch-plugin)
- [Integrations](https://support.tiled.co/integrations#main-content)

    - [CRM & Marketing Automation](https://support.tiled.co/integrations#crm-marketing-automation)
    - [Content & Asset Management](https://support.tiled.co/integrations#content-asset-management)
    - [Collaboration & Communication](https://support.tiled.co/integrations#collaboration-communication)
- [New Releases](https://support.tiled.co/new-releases#main-content)

    - [v65.0.0](https://support.tiled.co/new-releases#v65-0-0)
    - [v64.0.0](https://support.tiled.co/new-releases#v64-0-0)
    - [v63.0.0](https://support.tiled.co/new-releases#v63-0-0)
    - [v62.0.0](https://support.tiled.co/new-releases#v62-0-0)
    - [v61.0.1](https://support.tiled.co/new-releases#v61-0-1)
    - [v60.0.0](https://support.tiled.co/new-releases#v60-0-0)
    - [v59.0.0](https://support.tiled.co/new-releases#v59-0-0)
    - [v58.0.0](https://support.tiled.co/new-releases#v58-0-0)
    - [v57.0.0](https://support.tiled.co/new-releases#v57-0-0)
    - [v56.0.0](https://support.tiled.co/new-releases#v56-0-0)
    - [v55.0.1](https://support.tiled.co/new-releases#v55-0-1)
    - [v54.0.0](https://support.tiled.co/new-releases#v54-0-0)
    - [v53.0.0](https://support.tiled.co/new-releases#v53-0-0)
    - [v52.0.0](https://support.tiled.co/new-releases#v52-0-0)
    - [v51.0.0](https://support.tiled.co/new-releases#v51-0-0)
    - [v50.0.0](https://support.tiled.co/new-releases#v50-0-0)

[![logo-horizontal\_k-3](https://support.tiled.co/hs-fs/hubfs/logo-horizontal_k-3.png?width=100&height=21&name=logo-horizontal_k-3.png "logo-horizontal_k-3")](https://tiled.co)

Copyright © 2026, Tiled