我正在从Outlook发送一封
HTML电子邮件到我的mail.live.com帐户.当我使用Firefox查看mail.live.com中的结果时,电子邮件看起来没问题,但是当我使用IE时,所有内容都是居中的.
我添加了很多align = left和inline CSS style =’text-align:left’来控制它,但它没有任何区别.
当我将HTML文件直接加载到IE中时,它没问题;只有从我的Live / Hotmail帐户查看时才会出现偏差.
有人有这个问题吗?
<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,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>
来自其他用户的其他信息:
到目前为止,答案似乎都没有帮助.我将顶层堆叠表放在中心,所有嵌套表左对齐text-align:left;在所有可能的元素上,它没有改变任何东西.
然后我在整个代码中删除了所有居中文本和表格的实例,并且它仍然在IE 9中的所有Web电子邮件客户端中以居中文本呈现.有趣的是,如果我从IE 9中的Gmail或Yahoo发送电子邮件,它会正确呈现(没有添加所有额外的对齐/文本对齐左侧).但是,此电子邮件必须源自Outlook,因此在这种情况下这不是一种可行的解决方法.