(custom before/after slide) div going to the top of page when putting it under another div in a section

Hi there,

I am a little new to Webflow so I am not familiar with all of the tools but any advice would be greatly appreciated!
I am trying to create a custom before and after slider in Webflow and I can’t seem to stack two divs on top of each other.
This is my structure so far

I made my ‘after’ section absolute and turned it to cover although, it then jumped to the top of the page. No matter which div I put under the other in this particular section, the bottom always seems to stick to the top instead of covering the other image above it in the section.

Anyone know why this might be? Thank you in advance!

Here is my public share link: LINK
(how to access public share link)

Hey! You need to make your parent container (before and after) position relative that should help solve your issue if it doesn’t can you please provide a working public share link? Thanks!


Hey Austin! I tried changing the parent container to relative but it didn’t seem to help the issue. I’ve attached a working link above if you’re able to check it out. Thanks so much, very appreciated :slight_smile:

Hey can you share the preview link one more time for some reason that isn’t working


What page is this on?

It is on the portfolio page!

Hey! Just a minor adjustment on this. Sorry I was a little vague on what needed to be position relative before. Here’s a video explaining how to fix it: Loom Walkthrough

Let me know if that makes sense :slight_smile:

1 Like

Wow that was so helpful, thank you so much! It seemed to work exactly how you explained in your video. Much appreciate! :blush:

1 Like

Absolutely! Happy to help :tada: