Gray scale effect on Essential Grid images

Support
#1

Hi there,

i have a probelem with a grid. I have successfully created a gray scale effect wich works fine in chrome. But the internet explorer doesnt display the effect. Here is what i have done so far:

Added CSS in Grid:
/GRAY SCALE/
.esg-media-cover-wrapper .esg-media-poster {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.esg-media-cover-wrapper:hover .esg-media-poster {
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}

And added this in Theme Custom CSS:
// Grayscale Effect Logos Essential Grid
.esg-media-poster {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.esg-media-poster:hover {
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}

Could you please help me out here

#3

Hi There,

Please refer to : https://stackoverflow.com/questions/35711940/make-a-grayscale-image-with-css-in-ie11-running-in-quirks-mode

Hope it helps