In email template, mail automatically removes pointer-events: none in class

user_8814903 0
Viewed 668

As i am working in email templates, i added a class like this in my email template.

img {
  display: inline-block;
  vertical-align: middle;
  max-height: 100%;
  max-width: 100%;
  pointer-events: none;
}

but when I open the mail in the inbox. It automatically removes pointer-events in the css class.

img {
  display: inline-block;
  vertical-align: middle;
  max-height: 100%;
  max-width: 100%;
}

like this. Is there any solution or workaround for this?

html-email gmail css email html
1 Answers

As it seems the pointers-events property is not supported, you may use z-index property. Something like this:

.container {
   position: relative;
   z-index: 0;
   background: none;
}
.container > * {
   position: relative;
   z-index: -1;
}

This makes content visible, but not clickable, because parent div is on top layer.

user_73340970
Related