【发布时间】：2014-05-18 16:24:55
【问题描述】：
我正在整合一封电子邮件，但它正在把我的头发扯掉！我的电子邮件采用居中布局（我目前使用的是Ink's hero template）。问题是我的布局没有在 Outlook Web 应用程序中居中，因为此客户端不支持边距（因此我无法使用 margin: 0 auto; 将我的布局居中）。
这是我的代码示例：
<!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"/>
<meta name="viewport" content="width=device-width"/>
</head>
<body>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="header" valign="top" align="center">
<table class="container" width="580" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td class="wrapper last" valign="top" style="padding-top:10px;">
<img src="http://www.numeezy.com/img/numeezy-header.png" alt="Numeezy, l'hébergement professionel haute performance"/>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" align="center">
<table class="container" width="580" align="center">
</table>
</td>
</tr>
</table>
</body>
</html>
因此，Outlook 无法很好地呈现我的电子邮件，因为 Outlook 删除了我的所有 align="center" 属性。
<div style="width:100%;margin:0;padding:0;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="border-collapse:collapse;border-spacing:0;width:100%;text-align:justify;padding:0;">
<tbody>
<tr style="padding:0;">
<td valign="top" style="background-color:#17303E;padding:0;">
<span style="background-color:#17303E;">
<table width="580" border="0" cellspacing="0" cellpadding="0" style="border-collapse:collapse;border-spacing:0;width:580px;text-align:justify;margin-top:0;margin-bottom:0;padding:0;">
<tbody>
<tr style="padding:0;">
<td valign="top" style="padding:10px 0 0 0;">
<img blockedimagesrc="http://www.numeezy.com/img/numeezy-header.png" alt="Numeezy, l'hébergement professionel haute performance">
</td>
</tr>
</tbody>
</table>
</span>
</td>
</tr>
<tr style="padding:0;">
<td valign="top" style="padding:0;">
<table width="580" style="border-collapse:collapse;border-spacing:0;width:580px;text-align:justify;margin-top:0;margin-bottom:0;padding:0;">
</table>
</td>
</tr>
</tbody>
</table>
</div>
宽度为 580 像素的表格应垂直居中。我可以通过删除margin: 0; 样式并添加align="center" 属性在开发人员工具中“模拟”它。这可能是一个线索！
提前感谢您的帮助！
编辑：用最新版本编辑了我的代码
【问题讨论】：
-
与其摆弄这些细节，不如在一个低得多的层次上进行思考：如果涉及到安全线程，html 电子邮件是当今最大的问题之一。他们的设计是邪恶的。实际上，几乎从来没有真正需要过。而是发送一封带有指向网页的链接的纯文本电子邮件，95% 的收件人会对这种公平的姿态感到非常高兴。
-
@arkascha 这是一个有趣的观点，但它与机密数据不兼容，缺乏舒适性（登录页面上的身份验证）。
-
怎么样？您想暗示将机密数据作为电子邮件内容发送是安全的吗？对不起，但电子邮件是安全的。无论如何，如果这是您唯一关心的问题，请创建一个带有使用令牌的链接。拒绝访问没有此类令牌的网页。你就是这样：对收件人来说优雅且风险较小。
-
没有考虑过代币，这是个好主意。我所说的机密是指我们发送的电子邮件的目标是发送给唯一的收件人。但这不是我的问题的目的，我想知道如何在不避开整个系统的情况下做到这一点。无论如何感谢您的建议。
-
当然，一切都好。但同样：请记住，在电子邮件中发送机密数据是不安全的。阅读发给其他人的电子邮件是互联网上比较容易的挑战之一。