Cannot apply transform hover effect to Card component
Posted: Thu Apr 09, 2026 1:46 am
I tested the official Card demo and I noticed that the demo seems to animate individual card items on hover, rather than the whole card container.
In my project, I am trying to apply a hover transition like `translateY(-5px)` to the full Card object, but nothing happens in browser preview.
Does the Card component support transform transitions on the whole card, or are transitions only intended for the internal card items?
If full-card transform is not supported, what is the recommended workaround?
* animate the parent container?
* animate individual card items?
* use built-in card transitions only?
Thanks.
In my project, I am trying to apply a hover transition like `translateY(-5px)` to the full Card object, but nothing happens in browser preview.
Does the Card component support transform transitions on the whole card, or are transitions only intended for the internal card items?
If full-card transform is not supported, what is the recommended workaround?
* animate the parent container?
* animate individual card items?
* use built-in card transitions only?
Thanks.