Avada Post Card Hover Type (Lift Up) Blocks Buttons – Any Fix?

  • Unknown's avatar

    Hi everyone,
    I’m using the Avada theme with WooCommerce Post Cards and facing a serious issue. When I set the Column’s Hover Type to Lift Up (or any hover effect), the buttons in the Nested Column become non-clickable and don’t respond to hover. Setting Hover Type: None fixes it, but the card lacks a dynamic look.

    Concept: This is a Post Card for my WooCommerce products, featuring an image, title, and price. It has a clean, minimal design, avoiding clutter from excessive buttons or text. When a customer hovers over a product, the hover effect reveals additional text and buttons (e.g., “Add to Cart”). With the “Lift Up” effect, the Post Card looks great, and the buttons appear as expected, but they are not clickable.

    Details:

    • Main Column: Hover Type: None (currently), Border: 1px #FFD1DC, Background: #FFFFFF.
    • Nested Column: Position Absolute: On, Bottom: -80px, Opacity: 0 → 1 (Hover Element: Parent), Z-Index: 100.
    • Buttons: Z-Index: 101, Link: /shop, Background: #d74929, Hover: #b53a21.
    • Tried increasing Z-Index, but no luck.
    • Goal: Dynamic hover effect (e.g., Lift Up or similar) with functional buttons.

    Has anyone encountered this? How can I use Lift Up without blocking buttons? I tried alternatives like Translate Y or Box Shadow, but Avada doesn’t support hover-specific Box Shadow in the Design Tab.

    I was trying to avoid custom CSS, so I thought I’d ask you guys. But there’s probably no other way to solve it than with custom CSS.

    You can see the problem on the linked site, last product collumn on the bottom.

    Anyway, it’s worth a question.

    Thanks for any help!

    The blog I need help with is: (visible only to logged in users)

  • The topic ‘Avada Post Card Hover Type (Lift Up) Blocks Buttons – Any Fix?’ is closed to new replies.