小贝子编程

从 Outlook 文本左对齐发送的 html 电子邮件在 gmail IE 中不起作用



我知道以前有人问过这个问题，我想我几乎尝试了其他人提出的所有建议。但我的问题是：

我有使用Outlook发送html电子邮件（不在浏览器中，是办公套件的一部分），这不是一个选择。我使用表格、表格等。为了使电子邮件居中，我使用了table align="center"，也尝试将其放在td上，没有不同的结果。无论我做什么，当我试图将text-align=left;放在表中的任何内容上时，当在IE中查看时，它会将Gmail和Outlook中的文本居中。…在Firefox和Chrome中，我的文本向左对齐看起来很正常，但只有在IE中它才能做到这一点。问题是，我们要发送的人只能使用IE、Outlook和Gmail。。。。

我试了好几天了，什么都不管用，我试了几十条别人的建议，什么都没用。

和下一个例子一样简单也不起作用：

<table width="600" align="center">
   <tr>
      <td align="left" style="text-align:left;">Some text</td>
   </tr>
</table>

即使是我读过的教程中的模板也会出现同样该死的错误。任何人都知道如何解决这个问题，或者我注定要失败，因为这封电子邮件必须从Outlook和他的Word呈现引擎发送。。。。。并且必须在IE中查看。。。。还有gmail。。。。。

我尝试了慷慨的Gortonington给我的确切代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Testing</title>
<style type="text/css"> 
/**This is to overwrite Outlook.com’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} 
.ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td {line-height: 100%} /**This is to center your email in Outlook.com************/ 
.ExternalClass {width: 100%;} 
  </style>
</head>
<body style="margin:0; padding:0;background-color:#CCCCCC;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="center">
      <table width="600" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
        <tr>
          <td align="left">
            Your text here... Lalalalalal Lalalalala Lalalalala
            <br/>
            lalalalalalalalala
            <br/>
            lalalalala
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>
</body>
</html>

我用Outlook（Microsoft Office Professional Plus 2010）邮寄了它-->这就是我们使用的方法

在浏览器IE（10）中，Gmail和旧Hotmail/新Outlook的结果仍然是居中的文本。我想发布照片，但我没有足够的声誉。。。

更新：根据要求，IE中的代码Outlook.com构成电子邮件：

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=utf-8">
<html class="m_ul fh  hnl  useCss3" xml:lang="nl" lang="nl" xmlns="http://www.w3.org/1999/xhtml">
<head><style>
*
{
    line-height: 142%;
}
body
{
    color: #000;
    font-family: "Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue","BBAlpha Sans","S60 Sans",Arial,sans-serif;
    font-size: 88%;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    direction: ltr;
    background-image: none;
    background-repeat: repeat;
    background-position-x: left;
    background-position-y: top;
    background-color: rgb(255, 255, 255);
}
p
{
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 1.35em;
    margin-left: 0px;
}
html.fh
{
    overflow-y: hidden;
}
html.fh .c_base
{
    left: 0px;
    top: 40px;
    right: 0px;
    bottom: 0px;
    position: absolute;
    overflow-x: visible;
    overflow-y: auto;
    min-width: 964px;
}
html.hnl.fh .c_base
{
    top: 50px;
}
div.c_main
{
    margin-top: auto;
    margin-right: 0px;
    margin-bottom: auto;
    margin-left: 0px;
}
::selection
{
    color: #fff;
    background-color: rgb(0, 114, 198);
}
.t_mbgc, #c_h_theme_m
{
    background-color: rgb(255, 255, 255);
}
.t_qtc, .t_qtc:hover, .t_qtc:visited, .mlRd .t_estc
{
    color: #444;
}
body
{
    display: none;
}
body
{
    display: block !important;
}
body
{
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.DefaultFont, body, textarea, select, input
{
    color: #000;
}
body
{
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
body
{
    margin-top: 0px !important;
    border-top-color: currentColor !important;
    border-right-color: currentColor !important;
    border-bottom-color: currentColor !important;
    border-left-color: currentColor !important;
    border-top-width: 0px !important;
    border-right-width: 0px !important;
    border-bottom-width: 0px !important;
    border-left-width: 0px !important;
    border-top-style: none !important;
    border-right-style: none !important;
    border-bottom-style: none !important;
    border-left-style: none !important;
    position: static !important;
}
body.IE_M10
{
    -ms-touch-action: pinch-zoom;
}
.ClearBoth
{
    clear: both;
}
html.fh .c_base
{
    overflow-x: auto;
    overflow-y: visible;
    min-width: 0px;
}
#pageInbox
{
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    position: absolute;
    -ms-touch-action: none;
}
.AppContainer
{
    left: 0px;
    top: 0px;
    width: 100%;
    right: 0px;
    bottom: 0px;
    overflow: hidden;
    position: absolute;
}
.v-ReadMessageContainer
{
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    padding-left: 20px;
    position: absolute;
    outline-width: medium;
    outline-style: none;
    outline-color: invert;
    -ms-touch-action: manipulation;
}
.FullView .v-ReadMessageContainer
{
    left: 0px !important;
    top: 0px !important;
    right: 0px !important;
}
.ContentRight
{
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    position: absolute;
    min-width: 588px;
}
.ContentRightInner
{
    left: 0px;
    top: 0px;
    right: 0px;
    position: absolute;
}
.FullView .ContentRightInner
{
    bottom: 2.2em;
}
.WithRightRail
{
    right: 160px;
    min-width: 428px;
}
#ReadMessageScrollableSection
{
    outline-width: medium;
    outline-style: none;
    outline-color: invert;
}
.c-ReadMessage
{
    width: 100%;
    height: 100%;
    margin-right: 20px;
    position: relative;
    outline-width: medium;
    outline-style: none;
    outline-color: invert;
}
.c-ReadMessage .rmMessages
{
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    padding-right: 20px;
    position: absolute;
    overflow-y: scroll;
}
.c-ReadMessagePart
{
    margin-bottom: 20px;
    border-top-color: #ccc;
    border-top-width: 1px;
    border-top-style: solid;
    position: relative;
}
.c-ReadMessagePartBody .readMsgBody
{
    padding-top: 16px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    overflow-x: auto;
    overflow-y: hidden;
    -ms-touch-select: grippers;
}
.containsYSizerBar
{
    width: 100%;
    height: 100%;
    position: absolute;
}
.Snippet, .ExternalClass
{
    font-family: Calibri,sans-serif;
    font-size: 15px;
}
.slideOnResize
{
    transition-property: top, left, right;
    transition-duration: 367ms, 367ms, 367ms;
    transition-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1), cubic-bezier(0.1, 0.9, 0.2, 1), cubic-bezier(0.1, 0.9, 0.2, 1);
    transition-delay: 0s, 0s, 0s;
}
body
{
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.ExternalClass p.ecxMsoNormal, .ExternalClass li.ecxMsoNormal, .ExternalClass div.ecxMsoNormal
{
    font-family: "Calibri","sans-serif";
    font-size: 11pt;
}
</style></head>
<body class="t_body ltr SignedIn IE IE_Win Win6 IE_M10 IE_D0 Full RE_Trident NoTouch" id="&#47;ol&#47;mail.fpp" style="cursor: auto;"><div class="AppContainer"><div class="c_base" id="c_base" style="top: 50px;"><div class="c_main" id="c_content"><div id="pageContent"><div class="v-Page" id="pageInbox"><div id="inboxControl0f"><div class="containsYSizerBar"><div class="ContentRight WithRightRail FullView" style="left: 205px;" data-link="class{:~tag.contentRightClass(Layout.IsFullView, Layout.ReadingPaneMode)}"><div class="ContentRightInner t_mbgc t_qtc t_urtc"><div tabindex="-1" class="v-ReadMessageContainer slideOnResize" id="inboxControl0fv-ReadMessageContainer" style="visibility: visible; animation-name: null; animation-duration: 0s; animation-timing-function: ease; animation-delay: 0s; animation-direction: normal; animation-iteration-count: 1; animation-fill-mode: none;"><div class="c-ReadMessage" data-link="class{readMessageClass: ~tag.Show}"><div tabindex="-1" class="rmMessages ClearBoth" id="ReadMessageScrollableSection"><div class="c-ReadMessagePart ReadMsgContainer HasLayout ClearBoth HideShadows FullPart NoHistory Read RmIc" id="readMessagePartControl398f" data-link="class{:~tag.getHeaderCssClass(IsConversationPart, IsRead, IsDraft, IsTrustedSender, Items.length)}"><div class="c-ReadMessagePartBody" data-link="class{getClass:IsBodyExpanded}">
<div class="readMsgBody">
 <div class="ExternalClass MsgBodyContainer" id="bodyreadMessagePartBodyControl403f" data-link="class{:~tag.cssClasses(PlainText, IsContentFiltered)}">
  <style>
   .ExternalClass p.ecxMsoNormal {
    font-family: "Calibri","sans-serif";
    font-size: 11pt;
   }
   .ExternalClass li.ecxMsoNormal {
    font-family: "Calibri","sans-serif";
    font-size: 11pt;
   }
   .ExternalClass div.ecxMsoNormal {
    font-family: "Calibri","sans-serif";
    font-size: 11pt;
   }
   .ExternalClass a:link {
    color: blue;
    text-decoration: underline;
   }
   .ExternalClass span.ecxMsoHyperlink {
    color: blue;
    text-decoration: underline;
   }
   .ExternalClass span.ecxMsoHyperlinkFollowed {
    color: purple;
    text-decoration: underline;
   }
   .ExternalClass p.ecxMsoAcetate {
    font-family: "Tahoma","sans-serif";
    font-size: 8pt;
   }
   .ExternalClass li.ecxMsoAcetate {
    font-family: "Tahoma","sans-serif";
    font-size: 8pt;
   }
   .ExternalClass div.ecxMsoAcetate {
    font-family: "Tahoma","sans-serif";
    font-size: 8pt;
   }
   .ExternalClass span.ecxE-mailStijl17 {
    color: windowtext;
    font-family: "Calibri","sans-serif";
   }
   .ExternalClass span.ecxBallontekstChar {
    font-family: "Tahoma","sans-serif";
   }
   .ExternalClass .ecxMsoChpDefault {
    font-family: "Calibri","sans-serif";
   }
   .ExternalClass div.ecxWordSection1 {
   }
  </style>
  <div class="ecxWordSection1">
   <table width="100%" class="ecxMsoNormalTable" style="width: 100%;" border="0" cellspacing="0" cellpadding="0">
    <tbody>
     <tr>
      <td style="padding-top: 0cm; padding-right: 0cm; padding-bottom: 0cm; padding-left: 0cm;">
       <div align="center">
        <table width="600" class="ecxMsoNormalTable" style="width: 450pt; background-image: none; background-attachment: scroll; background-repeat: repeat; background-position-x: 0%; background-position-y: 0%; background-size: auto; background-origin: padding-box; background-clip: border-box; background-color: white;" border="0" cellspacing="0" cellpadding="0">
         <tbody>
          <tr>
           <td style="padding-top: 0cm; padding-right: 0cm; padding-bottom: 0cm; padding-left: 0cm;">
            <p class="ecxMsoNormal">
             Your text here... Lalalalalal Lalalalala Lalalalala <br />lalalalalalalalala <br />lalalalala <span style="font-size: 12pt;"></span>
            </p>
           </td>
          </tr>
         </tbody>
        </table>
       </div>
      </td>
     </tr>
    </tbody>
   </table>
   <p class="ecxMsoNormal">
    &nbsp;
   </p>
   <p class="ecxMsoNormal">
    &nbsp;
   </p>
  </div>
 </div>
</div>
</div></div></div></div></div></div></div></div></div></div></div></div></div></div></body></html>

Gmail在IE中的作用：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=utf-8">
<html class="aAX">
<head><style>
body
{
    width: 100%;
    height: 100%;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
body, td, input, textarea, select
{
    font-family: arial,sans-serif;
}
html
{
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
body
{
    width: 100%;
    height: 100%;
    overflow: hidden;
}
html.aAX
{
    overflow: visible;
}
.aAU
{
    overflow-x: visible;
    background-color: rgb(255, 255, 255);
}
body, td, input, textarea, select
{
    font-family: arial,sans-serif;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.nH
{
    zoom: 1;
}
.no
{
    float: left;
}
.nn
{
    float: left;
    min-height: 1px;
}
.Bs
{
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    border-collapse: collapse;
    position: relative;
    border-spacing: 0;
}
.Bu
{
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    vertical-align: top;
}
.aeJ
{
    overflow-y: scroll;
    background-image: none;
    background-attachment: scroll;
    background-repeat: repeat;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    background-origin: padding-box;
    background-clip: border-box;
    background-color: white;
}
.aeF
{
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    vertical-align: bottom;
}
.ads
{
    border-left-color: transparent;
    border-left-width: 1px;
    border-left-style: solid;
}
.Bk
{
    margin-bottom: 10px;
    position: relative;
}
.Bk .G2
{
    padding-top: 3px;
    border-top-color: #cfcfcf;
    border-right-color: #cfcfcf;
    border-bottom-color: #cfcfcf;
    border-left-color: #cfcfcf;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    background-color: transparent;
}
.Bk
{
    border-top-color: #efefef;
    border-right-color: #efefef;
    border-bottom-color: #e2e2e2;
    border-left-color: #efefef;
    border-top-width: 0px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
}
.aAT, .aAU
{
    background-image: none;
    background-attachment: scroll;
    background-repeat: repeat;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    background-origin: padding-box;
    background-clip: border-box;
    background-color: rgb(255, 255, 255);
}
.MsoNormal
{
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.hx
{
    background-color: transparent;
}
.hx .Bk
{
    float: none;
}
.hx .adn, .hx .adu, .hx .adf
{
    padding-left: 8px;
}
.hx .gs
{
    margin-left: 44px;
}
.hx .ky .Bk .G2, .hx .kv .Bk .G2, .hx .h7 .Bk .G2
{
    padding-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    border-top-color: #d8d8d8;
    border-right-color: currentColor;
    border-bottom-color: #d8d8d8;
    border-left-color: currentColor;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.hx .h7 .Bk .G2 .adn
{
    padding-bottom: 20px;
}
.hx .h7 .Bk, .hx .kv .Bk, .hx .ky .Bk
{
    margin-bottom: 0px;
}
.hx .ky .Bk, .hx .kv .Bk, .hx .h7 .Bk, .hx .kQ .Bk
{
    border-right-color: currentColor;
    border-bottom-color: currentColor;
    border-left-color: currentColor;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.hx .ii
{
    padding-bottom: 5px;
    margin-top: 5px;
    margin-right: 15px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.adn
{
    padding-bottom: 0px;
}
.hx
{
    color: #222;
    padding-top: 4px;
    padding-right: 8px;
    padding-bottom: 4px;
    padding-left: 8px;
}
.h7
{
    padding-bottom: 0px;
    max-width: 100000px;
}
.iY
{
    width: 100%;
    background-image: none;
    background-attachment: scroll;
    background-repeat: repeat;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    background-origin: padding-box;
    background-clip: border-box;
    background-color: rgb(255, 255, 255);
}
.if
{
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 1px;
    padding-left: 0px;
}
.gt
{
    font-size: 80%;
}
.ii
{
    padding-bottom: 20px;
    margin-top: 5px;
    margin-right: 15px;
    margin-bottom: 5px;
    margin-left: 15px;
    position: relative;
    direction: ltr;
}
.g
{
    color: #222;
}
.AO
{
    position: relative;
}
.iY
{
    position: static !important;
}
.hx
{
    padding-left: 4px;
}
.aHU
{
    position: relative;
}
.if
{
    margin-top: 0px;
    margin-right: 30px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.aBU, .hx .ky, .hx .kv, .hx .h7, .hx .kQ, .adx
{
    outline-width: medium;
    outline-style: none;
    outline-color: invert;
}
.MsoNormal
{
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}
.hx
{
    min-width: 502px;
}
html.aAX
{
    overflow: hidden;
}
body.aAU
{
    overflow-x: hidden;
    overflow-y: hidden !important;
}
.aeJ, .age
{
    padding-right: 15px;
}
.hx
{
    padding-left: 0px;
}
div.m14daf49cca364ccb p.MsoNormal, div.m14daf49cca364ccb li.MsoNormal, div.m14daf49cca364ccb div.MsoNormal
{
    font-family: "Calibri","sans-serif";
    font-size: 11pt;
    margin-top: 0cm;
    margin-right: 0cm;
    margin-bottom: 0pt;
    margin-left: 0cm;
}
</style></head>
<body class="aAU"><div style="position: relative; min-height: 100%;"><div class="nH" style="width: 1280px;"><div class="nH" style="position: relative;"><div class="nH"><div class="no"><div class="nH nn" style="width: 1075px;"><div class="nH"><div class="nH"><div class="ar4 z"><div class="AO"><div class="Tm aeJ" id=":4" style="height: 805px;" unselectable="on"><div class="aeF" id=":2" style="min-height: 377px;"><div class="nH"><div class="nH" role="main"><div class="nH g id"><table class="Bs nH iY" role="presentation" cellpadding="0"><tbody><tr><td class="Bu"><div class="nH if"><div class="nH aHU"><div class="nH hx"><div class="nH"><div tabindex="-1" class="h7 ie nH oy8Mbf"><div class="Bk"><div class="G3 G2"><div><div id=":p8"><div class="adn ads"><div class="gs"><div class="ii gt m14daf49cca364ccb adP adO" id=":pa"><div class="a3s" id=":p9" style="overflow: hidden;"><div lang="NL-BE" vlink="purple" link="blue"><div><table width="100%" style="width: 100%;" border="0" cellspacing="0" cellpadding="0"><tbody><tr><td style="padding-top: 0cm; padding-right: 0cm; padding-bottom: 0cm; padding-left: 0cm;">
<div align="center">
 <table width="600" style="width: 450pt; background-image: none; background-attachment: scroll; background-repeat: repeat; background-position-x: 0%; background-position-y: 0%; background-size: auto; background-origin: padding-box; background-clip: border-box; background-color: white;" border="0" cellspacing="0" cellpadding="0">
  <tbody>
   <tr>
    <td style="padding-top: 0cm; padding-right: 0cm; padding-bottom: 0cm; padding-left: 0cm;">
     <p class="MsoNormal">
      Your text here... Lalalalalal Lalalalala Lalalalala <br />lalalalalalalalala <br />lalalalala <span style="font-size: 12pt;"><u></u><u></u></span>
     </p>
    </td>
   </tr>
  </tbody>
 </table>
</div>
</td></tr></tbody></table></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></td></tr></tbody></table></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></body></html>

我也有同样的问题，我知道如何解决，不知道为什么，但把它放在head标签中解决了问题注意：您必须将文本放入P标签

<!--[if gte mso 9]>
    <style type="text/css">
     p {
          text-align: justify
     }
    </style>
<![endif]-->

创建一个100%的表，在align center表的td内左对齐，并将文本放入其中。

这段代码从Outlook变成了一场闹剧，导致gmail无法正确读取td样式。默认情况下，它会使其继承，从而导致对齐中心。通过创建一个新的嵌套表，您应该能够重新控制对齐。

在这里找到了一个可能有解决方案的类似问题。尝试将其包装在一个100%容器表中，然后在600px表之前的TD标记上，将其设置为align="center"。这应该使表居中，而不将inherit值设置为居中。

例如

<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="center">
      <table width="600" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td align="left">
            Your text here...
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

遇到了完全相同的问题，outlook对客户的回复是必备的。我的解决方案根本没有使用align/text align center。相反，我在包装表中添加了两列，每列的宽度都为"50%"。这解决了问题，并适用于所有主要客户（使用emailonacid进行测试）。

我的代码（还包括一些其他怪癖）：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Security Report</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<style type="text/css">
    .ReadMsgBody {
		width: 100%;
	}
	.ExternalClass {
		width: 100%;
	}
	span.yshortcuts {
		color: #000;
		background-color: none;
		border: none;
	}
	span.yshortcuts:hover, span.yshortcuts:active, span.yshortcuts:focus {
		color: #000;
		background-color: none;
		border: none;
	}
	a[x-apple-data-detectors] {
		color: inherit !important;
		text-decoration: none !important;
		font-size: inherit !important;
		font-family: inherit !important;
		font-weight: inherit !important;
		line-height: inherit !important;
	}</style>
</head>
<body style="margin:0;padding:0;">
<table cellspacing="0" cellpadding="0" width="100%" style="table-layout:fixed;border-collapse:collapse;">
	<tbody>
	<tr>
		<td width="50%" colspan="1" rowspan="1"></td>
		<td bgcolor="#FBFBFB" width="600" colspan="1" rowspan="1">
			<table cellspacing="0" cellpadding="0" border="1" width="600"
			       style="table-layout:fixed;border-collapse:collapse;border:solid 1px #E9E9E9;margin-left:auto;margin-right:auto;">
				<tbody>
				<tr>
					<td width="100%" align="left" style="border: 1px solid rgb(233, 233, 233);" colspan="1" rowspan="1">
						Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
					</td>
				</tr>
				</tbody>
			</table>
		</td>
		<td width="50%" colspan="1" rowspan="1"></td>
	</tr>
	</tbody>
</table>
<style type="text/css">.ReadMsgBody {
	width: 100%;
}
.ExternalClass {
	width: 100%;
}
span.yshortcuts {
	color: #000;
	background-color: none;
	border: none;
}
span.yshortcuts:hover, span.yshortcuts:active, span.yshortcuts:focus {
	color: #000;
	background-color: none;
	border: none;
}
a[x-apple-data-detectors] {
	color: inherit !important;
	text-decoration: none !important;
	font-size: inherit !important;
	font-family: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
}</style>
</body>
</html>

希望这能有所帮助。

更新此解决方案会导致Gmail和Yahoo显示内容正确对齐，所以不要使用它。我正在寻找其他不需要align属性/css的解决方案。。。

相关内容

最新更新


热门标签：

javascript python java c# php android html jquery c++ css ios sql mysql arrays asp.net json python-3.x ruby-on-rails .net sql-server django objective-c excel regex ruby linux ajax iphone xml vba spring asp.net-mvc database wordpress string postgresql wpf windows xcode bash git oracle list vb.net multithreading eclipse algorithm macos powershell visual-studio image forms numpy scala function api selenium