Help with Hover State

Hi there,

I’ve got an issue where a hover state seems to work as I add it, but when I preview or publish, the hover state isn’t working.

I have on hover state on the parent element that is working (the grow and the shadow), but when hovering over a project, I want the image to come in at 100% opacity. To do this, I’ve added a hover state to the “posterimage” element. Am I doing something wrong?

Thanks! Below is the site.


Here is my public share link: https://preview.webflow.com/preview/danny-weilandts-radical-projec-954d49?utm_medium=preview_link&utm_source=designer&utm_content=danny-weilandts-radical-projec-954d49&preview=6c155ee4d97d3f50024f5022da426358&mode=preview

Hi @Danny_Weilandt, this has something to do with the element structure. The Link Block has a z-index 100 which covers the posterImage, this is causing the posterImage Hover state to not trigger because you’re not hovering over it.

Ideally you would use child selectors in CSS, if you don’t want to code then I would suggest you to use handle the hover state using Interactions instead.