How to have next section go up and cover the first one when scrolling down

Hello! I have been trying to recreate this movement from Bob's Burger - Webflow Ecommerce Website Template. I really love the way the second section is covering the previous one when you scroll down. I’ve tried everything and still have not found a solution. Can anyone help? Thank you!

Just apply position: sticky and top: 0 on those blocks

And parent should have position: relative

Hi! Could you possibly walk me through it? I’m a Webflow noob :slight_smile:

Please check the screen shot.

You said you are a Webflow noob, using Webflow is not that hard but if you do not have good HTML/CSS knowledge/experience then it will be.

If you are too new on Webflow then I recommend you to learn some basics https://university.webflow.com/

Thanks @abirana. I did this before but it just would not stick like the site I wanted to recreate. I found a project similar to this that I replicated and I got it to work. But then the next issue was the 3rd section not sticking. I’ve got a good HTML background but this one had me stumped. Maybe I’ll go rewatch some of the basic tuts on webflow as a refresh. Thanks again!

1 Like

By the way, it will be easy for others to diagnose your issue after checking your project. So if you could share it, that would be helpful.

https://discourse.webflow.com/t/how-to-enable-a-webflow-share-link/2573/19

If I had to guess, it probably has to do with the parent element having the property overflow none. For some reason, they will break the sticky effect.