We are using the Bulletproof Email Background to add a background image that will be visible in Outlook. Instead of overlaying text inside of the <v:shape or <v:textbox elements, we are using an image with transparent background.
The issue we are seeing is that the overlay <img> is shrinking with the window. When making the Outlook window thinner, the background image stays the same size, and is "cut off" by the edge of the window as expected, but the overlay content shrinks to fit inside the window.
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml"style="width:760px;height:240px;" strokecolor="none">
<v:fill type="tile" color="#000000" src="backgroundImageURL" /></v:fill>
<img src="overlayImageURL" width="760px" height="240px" />
<!--[if gte mso 9]>
We've hacked away at this for a while trying a few options, but keep getting the same result. The rect does not change dimensions, the inner shape (or perhaps the <img>) does resize as the window gets smaller.
How can we keep the inner <img> width and height from changing in Outlook?
Thanks for all your invaluable help!
I did some preliminary testing with this code:
<!--[if gte mso 9]> <v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t"> <v:fill type="tile" src="http://i.imgur.com/XCnBXwP.png" color="#7bceeb"/> </v:background> <![endif]--> <table height="100%" width="100%" cellpadding="0" cellspacing="0" border="0"> <tr> <td valign="top" align="left" background="http://i.imgur.com/XCnBXwP.png"> <img src="https://dl.dropboxusercontent.com/u/1589284/support_public/transparent760x240.png" width="760" height="240" border="0" alt="rising sun" /> </td> </tr> </table>
and tested in Outlook 2007. I actually found that by shrinking the Outlook window, that the image sizes stayed the same both in the back-and-foregrounds. See:
Can you test to see if this version works for you, too? If not, can you contact us at support@ with your complete HTML file and let us know what version of Outlook you are testing in and we can take a more thorough look. :)