Estoy enviando un correo electrónico HTML desde Outlook a mi cuenta mail.live.com. Cuando veo los resultados en mail.live.com usando Firefox, el correo electrónico se ve bien, pero cuando uso IE todo el contenido está centrado.Correos electrónicos HTML Renderizado de texto centrado en IE
He añadido muchos align=left y CSS style='text-align:left' en línea para controlarlo pero no hace ninguna diferencia.
Cuando cargo el archivo HTML directamente en IE está bien; solo cuando se ve desde mi cuenta de Live/Hotmail está sesgado.
¿Alguien ha tenido este problema?
<html>
<body style='background:#333;font-family:arial;text-align:left;'>
<style>
#BlueStripe {
color:#000000;
background:#113399;
width:800px;
height:35px;
}
#Content {
width:800px;
}
#LeftContentPanel {
border:none;
padding:20px;
padding-top:5px;
}
#LeftContentPanel h1, h2, h3 {
color:#113399;
font-family:Arial,Verdana;
font-weight:normal;
margin-bottom:5px;
}
#LeftContentPanel p {
margin-top:5px;
}
h1, h2 {
font-weight:normal;
font-size:22px;
padding-bottom:0px;
}
#RightContentPanel {
width:220px;
padding:10px;
margin-top:10px;
margin-right:30px;
color:#fff;
font-weight:normal;
}
#RightContentPanel h1, h2 {
font-weight:normal;
font-size:20px;
margin-top:5px;
margin-bottom:-5px;
}
#RightContentPanel p {
font-weight:normal;
font-size:14px;
}
.edition {
text-align:left;
font-family:Arial,Verdana;
font-weight:normal;
font-size:16px;
color:#113399;
margin-left:10px;
margin-top:15px;
}
#FooterText {
color:#113399;
font-size:12px;
}
p {
text-align:left;
}
</style>
<table border='0' Id='PageWidth' Style='border:0px;width:800px;background:#fff;text-align:left;' cellpadding=0 cellspacing=0 align='center'>
<tr>
<td>
<table border='0' Style='border:0px;width:800px;' cellpadding=0 cellspacing=0 align='left'>
<tr Id='BlueStripe' Width='800'>
<td ColSpan='3'></td>
</tr>
<!-- Header -->
<tr id='LogoTitle' align='Left'>
<!-- Col 1/2 --> <td align='left'>
<img src='logo.jpg' alt='club logo' />
</td> <!-- Col 1 -->
<!-- Col 2/2 --> <td class='Panel2' ColSpan='2'>
<br />
<img src='title.jpg' alt='club news' />
<br />
<br />
<p class='edition' align='left'>Edition 9 – September 2011</p></td> <!-- Col 2 -->
</tr>
<!-- Banner Image - Dumb Bells -->
<tr Id='BannerImage' Style='width:800px;'>
<!-- Col 1/1 -->
<td ColSpan='3' Width='800px' Style='width:800px;text-align:left;' CellSpacing='0' CellPadding='0' align='Left'>
<img src='banner.jpg' alt='Dumb Bells' Width='800px' />
</td> <!-- Col 1 -->
</tr>
<tr Id='Content' align='Left'>
<!-- Col 1/1 -->
<td ColSpan='3'>
<br />
<table id='ContentPanel' Style='margin-top:10px'>
<tr align='Left'>
<td align='Left'>
<table id='' Style='border:0;text-align:left' align='left'>
<tr>
<td Id='LeftContentPanel' Width='460'>
<h1>Insert heading here</h1>
<p>
Vellant enes mo volupition eati amenima ximpor andis es mil mi,
optate cum in niatqui dellabo. Turiti quos debis demolen dustis
que peditat iorione quidignimin non con eaquatia nullore perit,
totat incimol orrum, coriassequo quia aut eos unt quia dolent
estemquodio odionseque esed que dolupta sperror sit quia que
pa dipsape llore, nitiis audi de nonse nisqui quia velit estem rem
quam rerum autem voluptiae atur?
</p>
<h1>Insert heading here</h1>
<p>
Feremos quisinte siment. Cium volorpo ressit re, omnisci as
autent as moluptas nonsece atquaessit eum dolut aut quis
nobisto quat aborem quis antempore, id moluptatur, sa que et
ea ium apis delignisi te si aut poribus ullaudae od quia conem
se verepud itatemporum ulparum re, volut velis eatis es accum
aut ratur, vende ius si doloriorum ent qui que velesciat que nam,
alitem ati a non remperorest restrum volentintem voluptatur am
rem eumqui quat et ea quiame quat.
</p>
<p>
Occatem poreium in rehentio eat el earia iur am, et laborio.
Itatur? Quiae estiorecese conseque niet estem as etusciur mos
ipsapid que videbit audit quid ut volupta sperias sequate ctotat
et et voluptis dellest, simus, secus aute quis iliquis si quia simus.
</p>
<div id='FooterText'>
more text here
</div>
</td>
</tr>
</table>
</td>
<td Width=5></td>
<td valign='top' align='left' style='padding:15px;text-align:left'>
<table Id='RightContentPanel' Style='text-align:left;' >
<tr style='padding:15px;text-align:left'>
<td style='margin-top:0px;padding:5px;padding:15px;text-align:left;padding-top:5px; background-color:#113399;'>
<h1>Insert header here</h1>
<p align='left' style='text-align:left'>
Vellant enes mo volupition eati
amenima ximpor andis es mil
mi, optate cum in niatqui de
llabo. Turiti quos debis demo
len dustis que peditat iorione
quidignimin non con eaquatia
nullore perit, totat incimol or
rum, coriassequo quia aut eos
unt quia dolent estemquodio.
</p>
</td>
</tr>
<tr>
<td height='35'>
</td>
</tr>
<tr>
<td Style='margin-top:30px;padding-top:5px;padding:5px;padding:15px;text-align:left;background-color:#ff3333;'>
<h1>Insert header here</h1>
<p>
Vellant enes mo volupition eati
amenima ximpor andis es mil
mi, optate cum in niatqui de
llabo. Turiti quos debis demo
len dustis que peditat iorione
quidignimin non con eaquatia
nullore perit, totat incimol or
rum, coriassequo quia aut eos
unt quia dolent estemquodio.
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td> <!-- End Col 1 -->
</tr>
<tr>
<td Id='BlueStripe' ColSpan='3'></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
Información adicional de otro usuario:
Ninguna de las respuestas hasta ahora parecen ayudar. Tenía mis tablas apiladas de nivel superior centradas y todas las tablas anidadas alineadas a la izquierda con text-align:left; en todos los elementos posibles y no cambió nada.
Luego eliminé todas las instancias de texto centrado y tablas en todo el código y TODAVÍA renderiza con texto centrado en todos los clientes de correo web en IE 9. Curiosamente, si envío el correo electrónico desde Gmail o Yahoo en IE 9, correctamente (sin tener que agregar todas las izquierdas adicionales de alineación/alineación de texto). Sin embargo, este correo electrónico debe originarse desde Outlook, por lo que no es una solución factible en este caso.
¿align = "left" en la etiqueta del cuerpo no tiene un efecto? –
¿Qué mecanismo usas para enviarlo? es un archivo adjunto HTML? o de alguna otra manera? – dldnh
Está indicando que el correo electrónico que envió desde Outlook se está probando desde su mail.live.com. ¿Intentó enviarlo a otro servidor de correo gratuito (mail.google.com, por ejemplo) y ver cómo se está procesando el mensaje de correo electrónico en IE? ¿Puede ser que el problema esté en el elemento HTML del contenedor? –