Outlook 2007のメールでフォント/パディングが正しく表示されない

Question

現在メーリングを作成していますが、フォントやパディングがテーブルに正しく表示されないという問題があります（Outlook 2007/2010はこれまでのところテスト済みです）。問題が発生する）。

例：http://i.imgur.com/apHAQpf.png

<table id="header" width="800" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td valign="top" height="350" background="https://gallery.mailchimp.com/31b5556e401fca10882aaeeff/images/541e9551-8e52-4234-adda-f07326a65e6c.png" bgcolor="#222222" style="height:350px;background-image:url('https://gallery.mailchimp.com/31b5556e401fca10882aaeeff/images/541e9551-8e52-4234-adda-f07326a65e6c.png');background-color:#222222;"> 

    <!--[if gte mso 9]> 
    <v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="border: 0; display: inline-block; width: 800px; height: 350px;" src="https://gallery.mailchimp.com/31b5556e401fca10882aaeeff/images/541e9551-8e52-4234-adda-f07326a65e6c.png" /> 
    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="border: 0; display: inline-block; position: absolute; width: 800px; height: 350px;"> 
    <v:fill opacity="0%" color="#222222" /> 
    <v:textbox> 
    <![endif]--> 

    <div style="padding:30px 100px 30px 50px !important;font-family:'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif !important;"> 
    <h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit</h1> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam et cursus sem. Nam viverra in diam auctor maximus. In laoreet ipsum eget augue iaculis congue. In placerat efficitur ex. Maecenas vel dui vitae risus lacinia viverra. Nunc dapibus placerat augue, non condimentum metus aliquet at.</p> 
    <span><a href="#" class="more light">Meer</a></span> 
    </div> 

    <!--[if gte mso 9]> 
    </v:textbox> 
    </v:fill> 
    </v:rect> 
    </v:image> 
    <![endif]--> 
    </td> 
</tr> 
</table> 

I（上記のように）直接インライン、ID /クラスを介してCSSを使用して試みました。しかし、それは助けに見えません。私が背景イメージを使わないときは、正しいフォントとパディングが読み込まれます。

誰でも解決方法を知っていますか？

Answer 1

私はあなただけ見通しのためのパディングをレンダリングするテーブルを持っているVMLでテーブルを追加しました。

<table id="header" width="800" border="0" cellspacing="0" cellpadding="0"> 
 
<tr> 
 
<td valign="top" height="350" background="https://gallery.mailchimp.com/31b5556e401fca10882aaeeff/images/541e9551-8e52-4234-adda-f07326a65e6c.png" bgcolor="#222222" style="height:350px;background-image:url('https://gallery.mailchimp.com/31b5556e401fca10882aaeeff/images/541e9551-8e52-4234-adda-f07326a65e6c.png');background-color:#222222;"> 
 

 
    <!--[if gte mso 9]> 
 
    <v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="border: 0; display: inline-block; width: 800px; height: 350px;" src="https://gallery.mailchimp.com/31b5556e401fca10882aaeeff/images/541e9551-8e52-4234-adda-f07326a65e6c.png" /> 
 
    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="border: 0; display: inline-block; position: absolute; width: 800px; height: 350px;"> 
 
    <v:fill opacity="0%" color="#222222" /> 
 
    <v:textbox> 
 
    
 

 
    <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
 
    <tbody> 
 
    <tr> 
 
     <td style="padding:30px 100px 30px 50px;>  
 
     
 
     
 
     <![endif]--> 
 
    
 
    <div style="padding:30px 100px 30px 50px !important;font-family:'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif !important; color:#ffffff;"> 
 
    <h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit</h1> 
 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam et cursus sem. Nam viverra in diam auctor maximus. In laoreet ipsum eget augue iaculis congue. In placerat efficitur ex. Maecenas vel dui vitae risus lacinia viverra. Nunc dapibus placerat augue, non condimentum metus aliquet at.</p> 
 
    <span><a href="#" class="more light">Meer</a></span> 
 
    </div> 
 

 
    <!--[if gte mso 9]> 
 
    
 
    </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
    
 
    
 
    </v:textbox> 
 
    </v:fill> 
 
    </v:rect> 
 
    </v:image> 
 
    <![endif]--> 
 
    </td> 
 
</tr> 
 
</table>

これはあなたのために働くなら、私に教えてください。