Two columns scroll behavior (advanced level)

Hello community :wave:

I’m trying to achieve that kind of scroll behavior
Example 1: enfin leve
Example 2: Balenciaga

The left column has a standard scroll behavior, while the right column can’t go beyond its top and bottom margin.

I try to inspect the code of both sites, but I don’t really but I don’t understand how they have done.

Any brilliant ideas? :bulb:

read-only link

You will use the sticky property on the right side. This Webflow University page explains in depth.

Here’s a short overview video:

How do you make the overflow content scrollable with a sticky position (like on the two website examples)?

I think I see what you’re saying.
You can set a negative distance to allow for that top overflow, essentially creating a sticky bottom. This might be tricky if you’re dealing with dynamic content and you’re not sure what negative distance to set.

Are you able to share the read-only link to the project, allowing the community to see where specifically you’re stuck?

Very possible there’s a custom coded option available when content is dynamic/unpredictable.

Thank you very much for your answer. Here is the read-only link

Negative distance seems to work for the beginning of the scroll, but when I’m at the bottom of the screen, I have to scroll back to the “scrolling breakpoint” to get a scroll up.

Any ideas? :pleading_face: I’m still looking for solutions :pray: