Streaming live at 10am (PST)

How to apply animation to flexbox parent but not to its children?

Hello everyone,

I am a beginner on webflow and I am currently struggling with animations despite all my efforts and tutorials I have watched…

So here is my problem, I want to apply a scale + brightness animation to an image without affecting the element on top of this image but I don’t find how to do that.

Here are two screenshots to illustrate my problem:


As you can see here, I don’t want my title to scale up and lower its brightness.

Can you please help me ? I’m pretty desperate now :slight_smile:
Many thanks!

Here is my public share link: https://preview.webflow.com/preview/one-two-trees?utm_medium=preview_link&utm_source=designer&utm_content=one-two-trees&preview=b31961773b70779bb8c85ca00b30b9ec&mode=preview

Hello.
That’s easy to do. Add an extra solid layer (with opacity 0.5 ) on top of the background image on hover state. Now when you hover the solid color it is in front of the image.
The rest of the content is not effected.