1
我似乎無法將表格單元格中的右下方表格與IE中的底部對齊。 (儘管對齊表格單元格的垂直對齊:「底部」並聲明valign =「底部」。HTML在IE中使用valign嵌套表格不能正常預覽
此外,這是一個電子郵件,所以在頭部的CSS聲明基本上是關閉的 它用表預覽已經堆疊名單垂直對齊頂端
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="10" bgcolor="#ffffff" style="font-size:1px; line-height:1px;"> </td>
<td width="258" bgcolor="#ffffff" valign="top" style="font-size:12px; line-height: 20px; font-family:Arial, Helvetica, sans-serif; color:#666666;"><table width="258" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="258" height="15" align="left" valign="top" bgcolor="#ffffff" style="font-size:12px; line-height: 20px; font-family:Arial, Helvetica, sans-serif; color:#666666;"><span style="font-size:18px; line-height:20px; font-family:Arial, Helvetica, sans-serif; font-weight:bold; color:#e48828;"><br />
Curabitur egestas lorem a nisl aliquet.</span><br />
<br />
Fusce faucibus lorem vel arcu aliquet rutrum. Etiam semper, urna ut scelerisque tristique, dolor sapien porta justo, rutrum tempor ipsum. <br />
<br />
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="15" bgcolor="#ffffff"> </td>
<td width="10" bgcolor="#ffffff"><img src="#" width="10" height="10" alt=" " style="display:block;"/></td>
<td width="10" bgcolor="#ffffff"> </td>
<td width="223" align="left" bgcolor="#ffffff" style="font-size:12px; line-height: 20px; font-family:Arial, Helvetica, sans-serif;"><a href="#" target="_blank" style="text-decoration:none; color: #e48828;">Etiam sem elit, venenatis sit.</a></td>
</tr>
</table></td>
</tr>
</table></td>
<td width="10" bgcolor="#ffffff" style="font-size:1px; line-height:1px;"> </td>
<td width="11" bgcolor="#eeefef" style="font-size:1px; line-height:1px;"> </td>
<td width="271" bgcolor="#ffffff" valign="top" style="font-size:1px; line-height:1px;"><table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="271" bgcolor="#ffffff"><table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100" height="152" bgcolor="#B2B3B7"> </td>
<td width="10" bgcolor="#eeefef" style="font-size:1px; line-height:1px;"> </td>
<td width="10" bgcolor="#FFFFFF" style="font-size:1px; line-height:1px;"> </td>
<td width="151" align="left" valign="middle" bgcolor="#ffffff" style="font-size:12px; line-height: 20px; font-family:Arial, Helvetica, sans-serif; color:#666666;"><br />
<span style="font-size:12px; line-height:18px; font-family:Arial, Helvetica, sans-serif; color:#005696;"><strong>Phasellus sed ipsum vel augue.</strong><br />
</span> <span style="font-size:10px; line-height:12px;">Aliquam suscipit libero non orci tincidunt nec convallis. <br />
</span></td>
</tr>
</table></td>
</tr>
<tr>
<td width="271" height="12" bgcolor="#eeefef"> </td>
</tr>
<tr>
<td width="271" valign="bottom" bgcolor="#ffffff" style="vertical-align:bottom;"><table border="0" cellspacing="0" cellpadding="0" height="100%">
<tr>
<td width="25" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px;"> </td>
<td width="10" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px;"> </td>
<td width="10" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px;"> </td>
<td width="226" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px;"> </td>
</tr>
<tr>
<td width="25" valign="middle" bgcolor="#ffffff"> </td>
<td width="10" valign="middle" bgcolor="#ffffff"><img src="#" width="10" height="10" alt=" " style="display:block;"/></td>
<td width="10" valign="middle" bgcolor="#ffffff"> </td>
<td width="226" align="left" valign="middle" bgcolor="#ffffff" style="font-size:12px; line-height: 20px; font-family:Arial, Helvetica, sans-serif;"><a href="#" target="_blank" style="text-decoration:none; color: #e48828;">Etiam sem elit, venenatis sit.</a></td>
</tr>
<tr>
<td width="25" valign="middle" bgcolor="#ffffff"> </td>
<td width="10" valign="middle" bgcolor="#ffffff"><img src="#" width="10" height="10" alt=" " style="display:block;"/></td>
<td width="10" valign="middle" bgcolor="#ffffff"> </td>
<td width="226" align="left" valign="middle" bgcolor="#ffffff" style="font-size:12px; line-height: 20px; font-family:Arial, Helvetica, sans-serif;"><a href="#" target="_blank" style="text-decoration:none; color: #e48828;">Etiam sem elit, venenatis sit.</a></td>
</tr>
</table></td>
</tr>
</table></td>
<td width="10" bgcolor="#eeefef" style="font-size:1px; line-height:1px;"> </td>
</tr>
<tr>
<td width="10" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px; border-bottom:1px solid #b2ccdf;"> </td>
<td width="258" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px; border-bottom:1px solid #b2ccdf;"> </td>
<td width="10" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px; border-bottom:1px solid #b2ccdf;"> </td>
<td width="11" height="15" bgcolor="#eeefef" style="font-size:1px; line-height:1px; border-bottom:1px solid #eeefef;"> </td>
<td width="271" height="15" bgcolor="#ffffff" style="font-size:1px; line-height:1px; border-bottom:1px solid #b2ccdf;"> </td>
<td width="10" height="15" bgcolor="#eeefef" style="font-size:1px; line-height:1px; border-bottom:1px solid #eeefef;"> </td>
</tr>
</table>
那麼它爲什麼要在工作IE瀏覽器? – Flauwekeul 2013-03-15 13:34:43
由於IE瀏覽器將用於在Outlook客戶端以及Hotmail,Gmail等Web客戶端中呈現 – Ateszki 2013-03-15 13:36:10
如果您從此行的表格中移除1005高度,會發生什麼情況
回答
我不會說這是一個錯誤
表在這條線:。
不需要更多的垂直空間進行渲染,因此它比左側更「封閉」。您的valign'ed表正確對齊,但它垂直對齊的td只有足夠大以容納它,所以沒有valign的實際效果。
我會只用一個表作爲需要。如果它是一個電子郵件模板解決這個問題,有rowspans和colspans,insted的無數嵌套的表格,你現在有...
來源
2013-04-07 01:51:29
相關問題