Outlook 2013 for Windowsでシミュレーションされたボタンの適切な高さと幅の属性を表示するためのスタイル付きアンカータグを取得できません。

Question

Mac用Outlook 15.33でコードが正しく動作します。ボタンは、Windows版のOutlookでリンクテキストの高さと幅を使用します。私はタグとタグとしてボタンを設定しようとしましたが、Windows版のOutlookで同じ書式設定の問題があります。

<table class="fullwidth260" border="0" width="215" cellspacing="0" cellpadding="5" align="left"> 
<tbody> 
<tr> 
<td valign="middle"> 
<a class="quickLinks" href="http://www.mba.org" style="display: flex; text-align: center; padding: 10px 20px 10px 20px; color: #496f8d; font-family: Arial, san-serif; size: 10pt; line-height: 1.2; border: 1px solid #c8d3dc; background-color: #e3e9ed; text-decoration: none; height: 60px; width: 160px; justify-content: center; flex-direction: column;">STATE RELATIONS ONLINE COMMUNITY</a> 
</td> 
</tr> 
</tbody> 
</table> 

Answer 1

ウェブ用ではなく、メール用のデザインです。 Outlook以外のMacでは、CSS属性のフレックスまたはパディングが完全にサポートされていません。

Outlookは、ボタンを正しく表示するための大きな苦痛です。私はあなたにもっとアドバイスをしたいと思いますが、既存のコードを投稿していないので、あなたの問題を解決するためのより良いアドバイスを提供する方法を提案するのが難しくなります。

幸運。

Answer 2

このメソッドを試してください。私はそれが私が知っているすべての電子メールクライアントで動作することがわかった。 tdの背景色、アンカータグの背景色、ストロークの色、ボタンの幅を変更する必要があります。

<table border="0" cellpadding="0" cellspacing="0" style="margin:0 auto;"> 
 
       <tr> 
 
        <td align="center" bgcolor="#87be45" width="150" style="-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;"> 
 
        <a href="http://www.example.com" style="padding: 10px;width:150px;display: block;text-decoration: none;border:0;text-align: center;font-weight: bold;font-size: 15px;font-family: sans-serif;color: #ffffff;background: #87be45;border: 1px solid #87be45;-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;line-height:17px;" class="button_link"> 
 
         Get Started! 
 
        </a> 
 
        </td> 
 
       </tr> 
 
       </table>

このことができますなら、私に教えてください。