How to remove scroll stretching when there’s no scrollable content

Need help Mobile
1

I’d like to remove the default rubber-banding or scroll bounce effect: when the page stretches slightly beyond its normal boundaries and then bounces back to its original position when the user stops scrolling. This only seems to happen on mobile. Here’s a video of what I’m referring to:

Is there custom code I can add in an HTML element to achieve this?

I tried this to an html then adding “no-scroll” to the ID attribute of both the index and specific group but it didn’t work.

#no-scroll { overscroll-behavior: none; }
2

I don’t think your other CSS code was specific enough.

Anyway, you could add an HTML element to your page:

html, body {
height: 100%;
overflow: hidden;
}

Try that.

1 Like
3

That worked! Thank you! You have no idea how helpful that is.

4

I tried adding to it to make the background black since it always shows up white regardless of what color I change it to in the editor but this didn’t work. Any idea what I need to change?

html, body { height: 100%; overflow: hidden; background-color: #000 !important; }