Maybe someone can help me with this html email...
I created a responsive html email. When I view the html file I created, the image shrinks when I shrink the browser window. However, when I send the email, it's no longer responsive, and the image doesn't shrink when I shrink the gmail or outlook window.
Any ideas?
Here's the image:
<td align="center">
<img src="https://lh3.googleusercontent.com/xxxxxxx" width="800" border="0" class="img-max" style="display: block; padding: 0; text-decoration: none; font-family: Helvetica, arial, sans-serif; font-size: 16px;" alt="Happy Birthday!" />
</td>
And the CSS from the top of the file:
<style type="text/css">
body {margin: 10px 0; padding: 0 10px; background: #FFFFFF; }
table {border-collapse: collapse;}
@media only screen and (max-width: 800px) {
body,table,td,p,a,li,blockquote {
-webkit-text-size-adjust:none !important;
}
table {width: 100% !important;}
img[class="img-max"] {
width:100% !important;
height: auto !important;
}
}
</style>
Thanks!