2009-11-20 37 views
0

這是一封HTML電子郵件。爲什麼表格不在資源管理器中?

我有兩張桌子在對方里面。一個設置爲100%,另一個設置700px寬。

這是HTML:

<table width="100%" border="0" align="center" cellspacing="0"> 
    <tr> 
    <td width="700"> 


    <table width="700" border="0" align="center" cellspacing="0"> 


     <tr> 
     <td colspan="2" align="center"><img src="i/header.jpg" width="700" height="935" alt="10 Good Reasons" /></td> 
     </tr> 
     <tr> 
     <td width="700"><img src="i/reasons.jpg" alt="10 Reasons to celebrate" /></td> 

     </tr> 

     <tr> 
     <td colspan="2"><p class="details">Thursday December 3rd <br /> 
      The Kings Head, 357 King William Street <br /> 
      4pm until 8ish.   
      <p class="details"> 
      <img src="i/hr.jpg" /> 
      <p class="details"><a href="mailto:[email protected]"><img src="i/rsvp.jpg" alt="RSVP" /></a></td> 
     </tr> 

     <tr> 

     <td><p class="unsubscribe"><a href="mailto:[email protected]">Please RSVP before November 27th.</a> 
     <unsubscribe>Click here to unsubscribe.</unsubscribe></p></td> 

     </tr> 

    </table></td> 
    </tr> 


</table> 

這是CSS:

/*//////////////ERIC MEYER RESET RELOADED////////////*/ 

html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, font, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
caption { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline; 
} 
/* remember to define focus styles! */ 
:focus { 
    outline: 0; 
} 

ol, ul { 
    list-style: none; 
} 
/* tables still need 'cellspacing="0"' in the markup */ 

caption, th, td { 
    text-align: left; 
    font-weight: normal; 
} 
blockquote:before, blockquote:after, 
q:before, q:after { 
    content: ""; 
} 
blockquote, q { 
    quotes: "" ""; 
} 


body { 
    background-image: url(i/bg.jpg); 
    background-repeat: repeat-y; 
    background-position: 50% 50%; 
    background-color: #888989; 
} 


img.top {margin-left:auto; margin-right:auto;display:block;} 
img.bottom {margin-left:auto; margin-right:auto;display:block;} 


p.details { 
    color: #666666; 
    font: 32px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; 
    text-align: center; 
    padding-bottom:5px; 
    padding-top:20px; 
} 

p.unsubscribe a { 
    text-decoration: none; 
    color: #666666; 
} 

p a:hover { 
    text-decoration:underline;} 

p.unsubscribe { 
    color: #666666; 
    font: 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; 
    text-align: center; 
    padding-bottom:20px; 
    padding-top:20px; 
    } 

table table {margin-left: auto; margin-right: auto;} 

a.in-a-browser { 
margin-left:auto; 
margin-right:auto; 
display:block; 
width: 1028px; 
height: 64px; 
background-image:url(i/top.jpg); 
text-align:center; 
color: #666666; 
font: 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; 
padding-top:0px; 
} 


td {text-align:center;} 
tr {text-align:center;} 
table {text-align:center;} 

任何建議,將不勝感激。

+0

HTML電子郵件?準備好Panadol或Herron了嗎? – random 2009-11-20 01:10:02

+0

@Jordan:至少在Chromuim/Firefox中對我好。 BTW您的取消訂閱鏈接不存在 – RageZ 2009-11-20 01:14:05

+0

感謝@RageZ Campaign Monitor添加此鏈接。 – Jordan 2009-11-20 01:16:56

回答

5

您已將外表中的表格單元格寬度設置爲700px,這與表格的100%寬度相沖突。刪除表格單元格的寬度。

0

一個元素沒有中心本身,對於約定,所以..容器(小區)應中心內部的元素(表):

<td align="center" ..> 
    <table etc etc>