TranslateY only
I want the center Element to go to the very top get smaller but stay in the center. I very much would like to keep the CSS / DOM structure that way, as I need it in my more complex project organized that way.
I tried to animate the center element from transform: translate(-50%, 50%) to transform: translate(-50%, 0%) but it always ended up ad translate(0%, 0%).
I searched around a while and understood that percentage Values in translate are at least trick, but some of the informati
This is one of the many reasons we strongly recommend setting your transforms via GSAP, as explained here. It's fine to set them in CSS initially too if you want, but then you can also specify them via GSAP in order to ensure that everything is parsed properly.
The core of the problem has to do with how the browsers report computed styles. GSAP must figure out what the current values are, of course, so that it can properly interpolate to the new ones. Browsers report them as a matrix
