I have discovered a strange issues with gmail where if my HTML email has any form of CSS3 gradient e.g:
<th style="text-align:right; font-size:14px; background:#ededed; background-image:-webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb)); background-image:-moz-linear-gradient(top, #ededed, #ebebeb); font-weight:bold;">
It will remove all styles from this <th>. As soon as I remove the background gradient stuff it works fine and leaves the rest of the styles in place. I have tried changing this to background: -moz-linear... all with the same effect. If gmail doesn't like it, it strips all styles from this element.
Has anybody else experienced this? Is there a solution to fix this?
I have tested the same email with Thunderbird and Mac Mail without any problems.
Gmail just does strange stuff with CSS in emails in general. Being that CSS support is so hit-or-miss, I'm not surprised that something as 'advanced' as a CSS3 gradient would be totally wrong.
The other thing that you have to consider is that most email clients won't recognize a CSS gradient, so I wouldn't bother trying.
If you want something to appear with a gradient, and you want it to show up for most email clients, you're going to have to create it as an image that is placed as content.