How make background image on newsletter in outlook?

Mateusz Rogulski picture Mateusz Rogulski · Oct 19, 2012 · Viewed 115.8k times · Source

I'm trying to make newsletter where I have some image as background and text on it. This is easy but I need this to work on Ms Outlook.

What I have tried:

1.

<td width="100" height="100" style="background: url('someurl');">text</td>

2.

<td width="100" height="100" background="someurl">text</td>

3.

<td width="100" height="100">
    <div style="width: 0px; height:0px; position: relative;">
        <div style="width: 100px; height: 100px; position: absolute; background: url('someurl')">
           text
        </div>
    </div>
</td>

But nothing works well on outlook. I have no idea how fix it. I'm using outlook 2007.

Any help would be appreciated.

Answer

laurent picture laurent · Mar 25, 2013

Powerful tool for "Bulletproof Email Background Images" (VML for Outlook 2007/2010/2013, and HTML/CSS for Outlook 2000/2003, Gmail, Hotmail...)

http://emailbg.net

as an exemple :

    <div style="background-color:#f6f6f6;">
  <!--[if gte mso 9]>
  <v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
    <v:fill type="tile" src="http://i.imgur.com/n8Q6f.png" color="#f6f6f6"/>
  </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/n8Q6f.png">
      </td>
    </tr>
  </table>
</div>

in order to have the specified background image to Full email body.

This link help to use the Vector Markup Language (VML)

msdn.microsoft.com/en-us/library/bb264137%28v=vs.85%29.aspx

www.w3.org/TR/NOTE-VML#_Toc416858389