Bild nicht ausrichten auf der rechten Seite auf Google Mail, Outlook und Yahoo Mail

Question

Ich bin neu zu E-Mail-Vorlagen-Designs und ich frage mich, warum das passiert mit meiner E-Mail-Vorlage. Der erste Screenshot ist, was ich erwarte und die anderen sind, was in Google Mail, Yahoo und Outlook gerendert wird. Mein Anliegen ist, warum das Logo nicht wie erwartet nach rechts ausgerichtet ist. Ich habe auch den entsprechenden Code angehängt, der das Logo zeigt.

<tr> 
 
\t <td align="center" valign="top"> 
 
\t <!-- CENTERING TABLE // --> 
 
\t <!-- 
 
\t The centering table keeps the content 
 
\t tables centered in the emailBody table, 
 
\t in case its width is set to 100%. 
 
\t --> 
 
\t <table border="0" cellpadding="0" cellspacing="0" width="100%" style="color:#ffffff;" bgcolor="#E1E1E1"> 
 
\t <tr> 
 
\t <td align="center" valign="top"> 
 
\t <!-- FLEXIBLE CONTAINER // --> 
 
\t <!-- 
 
\t The flexible container has a set width 
 
\t that gets overridden by the media query. 
 
\t Most content tables within can then be 
 
\t given 100% widths. 
 
\t --> 
 
\t <table border="0" cellpadding="0" cellspacing="0" width="600" class="flexibleContainer"> 
 
\t <tr> 
 
\t <td align="center" valign="top" width="600" class="flexibleContainerCell"> 
 

 
\t <!-- CONTENT TABLE // --> 
 
\t <!-- 
 
\t The content table is the first element 
 
\t that's entirely separate from the structural 
 
\t framework of the email. 
 
\t --> 
 
\t <table border="0" cellpadding="30" cellspacing="0" width="100%"> 
 
\t <tr> 
 
\t <td align="center" valign="top" class="textContent"> 
 
\t <img align="right" alt="accesbank-logo" src="http://oi65.tinypic.com/euel9v.jpg" /><br /><br /> 
 
\t </td> 
 
\t </tr> 
 
\t </table> 
 
\t <!-- // CONTENT TABLE --> 
 
\t </td> 
 
\t </tr> 
 
\t </table> 
 
\t <!-- // FLEXIBLE CONTAINER --> 
 
\t </td> 
 
\t </tr> 
 
\t </table> 
 
\t <!-- // CENTERING TABLE --> 
 
\t </td> 
 
</tr>

Answer 1

Sie haben eine Menge von align Zentrum auf der TDs, die rechts werden müssen auszurichten, wie das Logo in einer Tabelle, die rechts ausgerichtet werden soll.

Ich habe eine zusätzliche Tabelle hinzugefügt und machte es so groß wie das Logo und richtete es richtig aus.

\t <tr> 
 
\t <td align="right" valign="top"> 
 
\t <!-- CENTERING TABLE // --> 
 
\t <!-- 
 
\t The centering table keeps the content 
 
\t tables centered in the emailBody table, 
 
\t in case its width is set to 100%. 
 
\t --> 
 
\t <table border="0" cellpadding="0" cellspacing="0" width="100%" style="color:#ffffff;" bgcolor="#E1E1E1"> 
 
\t <tr> 
 
\t <td align="right" valign="top"> 
 
\t <!-- FLEXIBLE CONTAINER // --> 
 
\t <!-- 
 
\t The flexible container has a set width 
 
\t that gets overridden by the media query. 
 
\t Most content tables within can then be 
 
\t given 100% widths. 
 
\t --> 
 
\t <table border="0" cellpadding="0" cellspacing="0" width="600" class="flexibleContainer"> 
 
\t <tr> 
 
\t <td align="right" valign="top" width="600" class="flexibleContainerCell"> 
 

 
\t <!-- CONTENT TABLE // --> 
 
\t <!-- 
 
\t The content table is the first element 
 
\t that's entirely separate from the structural 
 
\t framework of the email. 
 
\t --> 
 
\t <table border="0" cellpadding="30" cellspacing="0" width="100%"> 
 
\t <tr> 
 
\t <td align="right" valign="top" class="textContent"> 
 

 
\t <table width="152" border="0" align="right" cellpadding="0" cellspacing="0" style="width:100%; max-width: 152px;"> 
 
\t <tbody> 
 
\t <tr> 
 
\t <td align="right"><img alt="accesbank-logo" src="http://oi65.tinypic.com/euel9v.jpg" /></td> 
 
\t </tr> 
 
\t </tbody> 
 
\t </table> 
 
\t </td> 
 
\t </tr> 
 
\t </table> 
 
\t <!-- // CONTENT TABLE --> 
 
\t </td> 
 
\t </tr> 
 
\t </table> 
 
\t <!-- // FLEXIBLE CONTAINER --> 
 
\t </td> 
 
\t </tr> 
 
\t </table> 
 
\t <!-- // CENTERING TABLE --> 
 
\t </td> 
 
\t </tr>

Lassen Sie mich wissen, ob dies es behebt. Wenn das Problem dadurch nicht behoben wird, benötigen wir mehr Code, um zu ermitteln, ob eine in Konflikt stehende Klasse oder ID vorhanden ist, die dazu führt, dass die Vorlage nicht in das Design übernommen wird.

Ist dies ein Teil einer Hybrid- oder Responsive-E-Mail?

Beifall