<!--
{
  "documentType" : "article",
  "framework" : "TVML",
  "identifier" : "/documentation/TVML/tv-scrollable-bounds-inset",
  "metadataVersion" : "0.1.0",
  "role" : "collectionGroup",
  "title" : "tv-scrollable-bounds-inset"
}
-->

# tv-scrollable-bounds-inset

Creates an unscrollable region of a specified size at the top and bottom of the stack
template.

## Overview

Use the `tv-scrollable-bounds-inset` style to create an unscrollable region of specified
size from the top and bottom of the `stackTemplate`. When you use unscrollable regions,
the content offset is no longer automatically adjusted to allow “peeking” — the partial
view of elements directly above and below the focused element.

Once focus is shifted from an unscrollable region to a scrollable region, the content
offset of the template is adjusted to the specified `tv-scrollable-bounds-inset`
value, so that the unscrollable region doesn’t appear on screen.

> Note: By default, the entire template is scrollable if you don’t define the tv-scrollable-bounds-inset
> style.

Here’s an example that sets the inset (unscrollable space) at the top, right, bottom,
and left all to 100 points.

```xml
<stackTemplate style="tv-scrollable-bounds-inset: 100.0;">
    <banner>
        …
    </banner>
    <collectionList>
        <shelf>
            <section>
                <lockup>…</lockup>
            </section>
        </shelf>
    </collectionList>
</stackTemplate>
```

Here’s an example that sets the inset (unscrollable space) at the top to 50 points,
and the inset at the bottom to 75 points.

```xml
<stackTemplate style="tv-scrollable-bounds-inset: 50.0 0.0 75.0 0.0;">
    <banner>
        …
    </banner>
    <collectionList>
        <shelf>
            <section>
                <lockup>…</lockup>
            </section>
        </shelf>
    </collectionList>
</stackTemplate>
```

### Values for tv-scrollable-bounds-inset

- Float: The amount of unscrollable space, in points, set at  the top, right,
  bottom, and left of the `stackTemplate`.
- Float Float: The first value determines the amount of unscrollable space in
  points at both the top and the bottom of the `stackTemplate`. The second value determines
  the amount of unscrollable space at both the right and left.
- Float Float Float: The first value determines the amount of unscrollable space
  in points at the top of the `stackTemplate`. The second value determines the amount
  of unscrollable space at both the right and the left. The third value determines
  the amount of space at the bottom.
- Float Float Float Float: The first value determines the amount of unscrollable
  space in points at the top of the `stackTemplate`. The second value determines the
  amount of unscrollable space at the right. The third value determines the amount
  of space at the bottom. The fourth value determines the amount of space at the left.

> Important: Currently, creating unscrollable regions at the left and right of the
> `stackTemplate `is not supported and will not have any effect.

### Elements That Use tv-scrollable-bounds-inset

- [stackTemplate](/documentation/TVML/stacktemplate)

## Topics

### Specifying Inset Location

[tv-scrollable-bounds-inset-top](/documentation/TVML/tv-scrollable-bounds-inset-top)

Specifies the size of an unscrollable region only at the top of the stack template.

[tv-scrollable-bounds-inset-bottom](/documentation/TVML/tv-scrollable-bounds-inset-bottom)

Specifies the size of an unscrollable region only at the bottom of the stack template.



---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)