I'm having an issue with the Gmail app on Android shrinking images and thus messing up a button made with Campaign Monitor's bulletproof buttons tool (http://buttons.cm/), which should have an image displayed over a fallback background color for when images are blocked. It works great in the desktop clients I've used, but in the Android (not iPhone) Gmail app, the image (which is just a 1px by 40px slice) starts to repeat vertically so that the top few pixels of the button also show up at the bottom.

I know webkit can do some strange zoom and resizing things. Anyone know a fix for images in this case? Code below:

<div style="text-align:center;">
    <!--[if mso]>
  <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://test.com" style="height:40px;v-text-anchor:middle;width:200px;" arcsize="10%" strokecolor="#0c0f18" fill="t">
    <v:fill type="tile" src="http://test.com/image.gif" color="#475fa2" />
    <w:anchorlock/>
    <center style="color:#ffffff;font-family:Calibri,sans-serif;font-size:16px;font-weight:bold;">Share on Facebook</center>
  </v:roundrect>
<![endif]-->
<a href="http://test.com" style="background-color:#475fa2;background-image:url(http://test.com/image.gif);border:1px solid #0c0f18;border-radius:4px;color:#ffffff;display:inline-block;font-family:Calibri,sans-serif;font-size:16px;font-weight:bold;line-height:40px;text-align:center;text-decoration:none;width:200px;-webkit-text-size-adjust:none;mso-hide:all;">Share on Facebook</a></div>