Streaming live at 10am (PST)

Animation Causing Margin Error

Hi,

We’re having trouble with an animation which we think is causing an issue where the page is stretched too far to the right. Images below on mobile, if you scroll to the left it shows a white empty space.

We would like the drone to animate out view but then comes into view without causing this issue, any help would be great. Thanks.

https://drone-motion.webflow.io

Hey @DroneMotion. I’m assuming the container of the animation is larger than the screen width. What you could do is make sure the container is 100% width, and make sure to set Overflow to Hidden. That way when the drone is out of the screen, the extra white space will not be created.

Hope this helps, cheers!

Hi Finn,

Thanks for the reply. That makes sense, I’ve changed the Overflow to Hidden, but i can’t seem to change the container width at all. Any ideas on how to do this?

PS: I’ve added a screenshot of the container boundaries.

55

Oh you are using a container (it’s like a responsive div, but the width is locked). Replace it with a DIV element instead, you’ll be able to control the width at every breakpoint.

Hi Finn,

Right I see! I tried doing that but still no luck. I even deleted everything in that section and it still happens. What do you think could be doing this?

Thanks.

Could you share your read-only link? I can check out the webflow project itself and try to find a solution.

Sorry I thought I had, here we go:

https://preview.webflow.com/preview/drone-motion?utm_medium=preview_link&utm_source=designer&utm_content=drone-motion&preview=e1083ec30047c29d708b5d4fc6015635&mode=preview