I am creating an email which has to be look good on Outlook. On the email, I have a paragraph of text (which heights amounts to 324px), and I need a background image (height: 153px) located on the bottom of the paragraph.
I now have the below codes:
<td align="center" valign="top" background="background.png" style="background-repeat: no-repeat;background-position:bottom;background-size: contain;" height="324" bgcolor="#ffffff">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width: 620px;height: 153px;">
<v:fill type="frame" src="background.png" color="#ffffff" />
<![endif]-->
Body Text here
<!--[if gte mso 9]>
</v:rect>
<![endif]-->
</td>
The current problem is:
Can anyone good at VML help me with this? Thanks a lot!
You may need to think outside the box on this one ;)
Option (A), create the background image with the required height, as per Syfer's comment
Option (B), Put most of the content above the VML, and only a couple of lines in the VML part. That way the VML part won't stretch, but you'll still get the effect, i.e.:
<td align="center" valign="top" background="background.png" style="background-repeat: no-repeat;background-position:bottom;background-size: contain;" height="324" bgcolor="#ffffff">
<p>Body text here</p>
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width: 620px;height: 153px;">
<v:fill type="frame" src="background.png" color="#ffffff" />
<![endif]-->
Part of body Text here
<!--[if gte mso 9]>
</v:rect>
<![endif]-->
</td>