Pricing Blog

Reveal Buttons on Card hover?

  • lunar_rei-1353459295504695417

    Rei

    4 months ago

    Hello Toddle community o/
    I'm trying to change the CSS styles of child elements based on the parent element.

    For example, I have a list of blog post cards that contain buttons with opacity set to 0.
    When a user hovers over a single card, the buttons should become visible (opacity: 1).

    The Toddle Styles Panel includes a CSS field at the bottom.
    After applying the necessary classes to parent & child elements I attempted to add the CSS below.

    .blog-card:hover .show-button {
    opacity: 1
    }

    Sadly, this did not work. I would appreciate any help the community could offer as I'm still quite new to Toddle.
    1353459295965937664-Screenshot_2025-03-23_130312.png
  • filip_dajkovic-1353461799407583242

    Filip Dajkovic

    4 months ago

    You can add style element as an element and write any CSS you want inside of it, I'd add it to the parent element and pasted your css inside
  • 1353462003175522445-CleanShot_2025-03-23_at_21.14.212x.png
  • lunar_rei-1353469232423374898

    Rei

    4 months ago

    Oh! Thank you so much for this Filip! 🙏