Top Header Animation Reveal - Overflow error


I am trying to create a similar animation to this one I found on youtube:
A Little Heading Reveal Animation in Webflow - YouTube.

I think I have followed the steps correctly.
However, my animation has an error with the overflow.
The initial text position is not hidden, so it doesn’t ‘reveal’, it just moves up.

This is my structure:
Screenshot 2022-06-05 at 16.09.33

Top Header Wrap is set to Overflow hidden.
Can anyone help me figure out what I may be missing?


Here is my public share link: (

Hi there,

Could you share the read-only link too. Thanks

Hi @carlocastells you have set only main container for heading top-header-wrap but you are missing div element header__line-wrapper that have overflow:hidden Inside this element should be placed your h1. When you change position of h1 -100% it will hide because of header__line-wrapper hiding its overflow .

Hope that helps to solve your request.