I have a dynamic list with two dynamic items, Item 1 and Item 2. Basically 2 divs each with a text container div and text inside. Both items have border-radius: 8px
When I hover over Item 1, the relevant animations occur, when I hover out they revert as expected, but the border-radius of Item 2 visually disappears
I have two changes that occur on hover:
- Hover state for .container
Animation: inner shadow change opacity & shadow size
Trigger: Hover over .container, affects text container - nested elements only
Animation: Hover Over - transform Y -70px - looped & Hover Out - transform Y to origin hover out - looped
Issue occurs in both webflow’s preview and on live site. Issue occurs on Chrome, but not Safari or Firefox. Both items show border-radius: 8px in the inspector, but only Item 1 visually shows the effect.
From what I can tell the issue only occurs when the interaction is a transform. I tried it with opacity and width and the issue didn’t occur.