center align email in outlook.com

Ho creato un email html molto semplice. http://staging.xhtml-lab.com/mailtest/center align email in outlook.com

Sta funzionando bene in tutti i client di posta elettronica, se non in hotmail.com/outlook.com

in email Hotmail è allineato a sinistra, dovrebbe rimanere allineato al centro.

Ho aggiunto il seguente codice come suggerito da emailology.org, ma non ha alcun effetto.

<style type=“text/css”> 
/**This is to overwrite Hotmail’s Embedded CSS************/ 
table {border-collapse:separate;} 
a, a:link, a:visited {text-decoration: none; color: #00788a} 
a:hover {text-decoration: underline;} 
h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited,h4,h5,h6,.t_cht {color:#000 !important} 
p {margin-bottom: 0} 
.ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td {line-height: 100%} 
/**This is to center your email in Hotmail************/ 
.ExternalClass {width: 100%;} 
</style>

Qualche suggerimento su che altro posso fare per allineare il centro di email?

fonte

2012-10-25 Alok Jain

Il problema potrebbe essere "

". Sono sicuro che ciò sia supportato da tutti i client di posta elettronica e MS Outlook/Hotmail è noto per essere particolarmente schizzinosi su ciò che supportano. Questa pagina può aiutare: http://www.campaignmonitor.com/css/ – kburns

Ecco uno che ho costruito che utilizzo come punto di partenza per tutte le mie e-mail. E funziona al 100% su tutti i principali client di posta elettronica:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title></title></head> 
<body style="margin: 0px; padding: 0px background-color: #FFFFFF;" bgcolor="#FFFFFF"><!-- << bg color for forwarding (leave white) // main bg color >> --><table bgcolor="#252525" width="100%" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td> 
<!-- CENTER FLOAT WIDTH --> 
<table width="600" border="0" valign="top" align="center" cellpadding="0" cellspacing="0"><tr><td><!-- Master Width of the center panel --> 
preheader... 
<!-- CENTER PANEL BG COLOR (to hide separation of tables on email forward from Outlook (known issue) --> 
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF"><tr><td><!-- Master Color of the center panel --> 

content... 

<!-- /CENTER BG COLOR --> 
</td></tr></table> 

<!-- /CENTER FLOAT WIDTH --> 
</td></tr></table> 
<!-- /CENTER FLOAT --> 
</td></tr></table></body></html>

Esso è dotato di uno sfondo bianco per quando qualcuno inoltra l'email sul (possono digitare su bianco, mentre lo sfondo per la parte html progettato rimane di colore). Anche il pannello principale è impostato con bgcolor perché Outlook mette degli spazi tra le tabelle quando viene inoltrato.

Spero che questo aiuti.

fonte

2012-11-20 16:22:00 John

che in realtà mi ha aiutato molto grazie! Non è possibile ottenere l'e-mail al centro tra Outlook Office 365 e Outlook 2010 ... aveva gli stessi tag che hai ma ovviamente l'ordine in cui il tuo è è in qualche modo diverso, corretto e funziona per centrare una e-mail in tutti i client. Grazie! – mike

Odio sopportare le cattive notizie, ma nulla funziona al 100% su tutti i client di posta elettronica. – Goose

@Goose. Per tutti i principali clienti lo fa. Ho aggiunto "maggiore" alla risposta, poiché ci sono molti servizi di client meno conosciuti come Litmus per cui non si fa il test. – John

Questo dovrebbe darvi una e-mail centrato:

<table style="width: 100%; background: red;"> 
    <tr> 
    <td> 
     <center> 
     <table style="width: 640px; background: blue; margin: 0 auto; text-align: left;"> 
      <tr> 
      <td> 
       Your content here 
      </td> 
      </tr> 
     </table> 
     </center> 
    </td> 
    </tr> 
</table>

Il center -tag è ciò che è richiesto da Outlook e outlook.com. Altri client utilizzano l'attributo margin. In alcuni client, il testo è centrato dopo lo center -tag e pertanto è richiesto l'attributo text-align.

Se si desidera che la larghezza di essere variabile a seconda delle dimensioni dello schermo, utilizzare il seguente codice:

<table style="width: 100%; background: red;"> 
    <tr> 
    <td> 
     <center> 
     <!--[if mso]> 
     <table style="width: 640px;"><tr><td> 
     <![endif]--> 
     <div style="max-width: 800px; margin: 0 auto;"> 
      <table style="background: blue; text-align: left;"> 
      <tr> 
       <td> 
       Your content here 
       </td> 
      </tr> 
      </table> 
     </div> 
     </center> 
     <!--[if mso]> 
     </td></tr></table> 
     <![endif]--> 
    </td> 
    </tr> 
</table>

Outlook non supporta max-width, e quindi la dimensione è fissato a 640px per Outlook. Per tutti gli altri client, la larghezza dell'e-mail sarà uguale a quella della finestra di visualizzazione, ma massimo di 800 px.

Per favore fatemi sapere se trovate un cliente in cui queste soluzioni non funzionano, in modo che possiamo trovare una soluzione che funzioni con il maggior numero possibile di clienti.

fonte

2013-08-12 11:25:29

molto utile @magnarmyrtveit grazie! –

Il tag '

' risolve da solo il mio problema Hotmail/Outlook. –

risposta

Problemi correlati