CSS transition not working

So I am trying to do some animation on a button. Basically when I hover, the text should slide up giving way to the text at the bottom. The text does slides up but it is happening instantly right now.

I tried animating this behavior with transition property but it doesn’t seem to be working.

What am I missing here?

Codepen link: https://codepen.io/pragyesh31/pen/KKgyzvv

You’ve added the transition to your .btn, but the elements that are changed on hover are .primary and .secondary, so you’d have to add the transition to those instead. Should be working then.

1 Like

ok, this is embarrassing. I should have set it at the right place.

Thank you!!