mix-blend-mode not working

  • Resolved jcawfield

    (@jcawfield)


    5 years, 5 months ago

    Hello,

    My site is heavily image-based and I want to header text to change so that it stands out from the background. I have tried using “mixed-blend-mode: difference;” but mixed-blend-mode is red and doesn’t seem to be working. I have used Elementor for the bulk building of my site and I’m using Custom CSS and JS to change the header color. In elementor, I gave the header the CSS class “custom-header”. I have attached a screenshot of what I have done: https://ibb.co/XkMJ3M4

    Thanks for your help:)

    • This topic was modified 5 years, 5 months ago by jcawfield.
Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Diana Burduja

    (@diana_burduja)

    Hello,

    this support forum is for any questions related to the plugin and not for debugging CSS or JS code. If you need help with your CSS code, then I’d recommend asking on StackOverflow.

    Nevertheless, try applying the “mix-blend-mode” property on the “.custom-header” element and not on the “.custom-header a”. The “color” property needs to stay on the “.custom-header a” element. Also, for Chrome make sure the <body> element isn’t set to transparent.

    Thread Starter jcawfield

    (@jcawfield)

    Thanks so much @diana_burduja

    I just tried your suggestions but unfortunately, they didn’t work ??
    I have now asked on StackOverflow and hopefully, they will be able to fix it

    Thanks for your help ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘mix-blend-mode not working’ is closed to new replies.