Remove hover effect from Classic Image

Hi there

I would like to remove the hover effect from the classic Image. Earlier you gave me this CSS which worked fine at that time but if I insert this CSS in a other website it doesn’t work:

a.x-img:not(.x-img-thumbnail):hover {
opacity: 1;
}

Any idea, what coud be the problem?

Thank you very much for your help!

Hello Felix,

Thanks for writing to us.

The code works fine at our end, It might be the syntax error in your other customs CSS code. You must check the Custom CSS code issue from here http://csslint.net/

If you want to avoid troubles with custom codes, you must use the native options of our themes and builders settings. You can replace the Classic Image element with the V2 Image element. Please have a look our documentation of Image Element https://theme.co/docs/image

Have a great day!
Thanks

Hi Prakash

Thank you very much for your reply and for your help. I couldn’t find any errors but it must be within this code:

/* Hides the reCAPTCHA on every page */
.grecaptcha-badge {
display: none !important;
}

@media only screen and (max-width: 600px) {

.envira-gallery-item {
width: 100% !important;
}

If I insert the “no-hover” CSS above this code it works, if it is below the code, it doesn’t.

Anyway, it works now and this is the main thing!

Thank again for your support!

Hey Felix,

In your shared code I see a missing curly bracket of the media query, try closing the missing curly bracket and then then test your code.

We’re glad that we could be of help. Cheers!

Hi Nabeel

Thank you very much for your reply! Yes, you are right but if I insert the curly bracket, the error is gone but then the Envira Gallery always shows in one column, not in three columns like it should…
So I better leave it as it is!
Thanks again for your great support!

Hi Felix,

If you didn’t close the bracket on your media query, the code below your media query will not work, so I advice that you will add the closing bracket of your media query to avoid so many problems in the future.

Hope that helps.

Thank you.

Hi Cramaton

Thank you very much for your advice. You are right but strangely as I said, if I close the bracket, the Envira Gallery always shows in one column, not in three columns. I have no idea why…
I have moved the code at the end, so nothing will be affected from the open bracket.
I hope this will work also in the future…

Thanks again for your help!

Hey Felix,

There might be other errors in your CSS which could be breaking your site. I’d recommend you to review your CSS closely and look out for any missing curly brackets or syntax errors. You can check your custom CSS here http://csslint.net/

You can also test by removing all of your CSS, if everything works then add your CSS block by block. Hope this helps!

Hi Nabeel

Ok, Thank you very much for your good advice and the link to the CSS tool! I will check it and hopefully find the error. I will let you know…

Thanks again for your great support!

Hi Felix,

Just let us know how it goes. If you have any other concerns, feel free to reach us.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.