Image animation scaling from the right of the page adds unwanted width to the page

The green leaves image scales and moves in from the left as you scroll.
I want the same to happen coming in from the right side.
However, this adds width to the right side of the page allowing me to scroll right.

Please help!


https://preview.webflow.com/preview/testing-site-46a289?utm_medium=preview_link&utm_source=designer&utm_content=testing-site-46a289&preview=66846466d65693c8d273e45c2085175f&mode=preview

Hi, I think you should set overflow: hidden for the parent element. If it is still not working, please share your read-only link.

Hi Pavel, thanks for your suggestion. It still doesn’t work. Please see my link below although the animations don’t appear to work on the share link?

If you look at the first left plant image animation - it scales up and moves no problem.
The right plant image animation just adds width to the page.

I’ve tried setting overflow hidden but this clips the image. I actually want overflow to happen to show the scale increase but not add the width on the right side of the website.

This is extremely complicated to explain in typed words so I apologise if it makes no sense!

https://preview.webflow.com/preview/testing-site-46a289?utm_medium=preview_link&utm_source=designer&utm_content=testing-site-46a289&preview=66846466d65693c8d273e45c2085175f&mode=preview

Try to remove the body paddings 25px and have the section on full width. Then in the section add 25px padding left and right and overflow hidden. Do not use overflow hidden on body element.

Let me know if it helps