使用 Campaign Monitor 发送电子邮件，有什么方法可以消除垂直对齐表格中文本上方的 5px 空白吗？

Question

发送大量电子邮件，几乎所有事情都在表格内。

CSS 影响表格：

.title  {
vertical-align: top;
}

HTML：

<table width="580" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="title" align="left" width="440" valign="top">
<h2><singleline label="Title">Enter your title</singleline></h2>
<p><multiline label="Description">Description</multiline></p>


</td>

<td align="left" valign="top" width="20"><img src="/images/00.gif" height="1" width="20" border="0"></td>

<td align="left" valign="top" width="120"><img src="/images/001.jpg" editable="true" label="Image" width="120" border="0"></td>
</tr>
<tr>
<td colspan="3" align="left" valign="top" width="580"><img src="/images/00.gif" height="20" width="1" border="0"></td>
</tr>
</table>

我需要标签内的文本与表格顶部齐平。目前 /images/001/jpg 是齐平的，但文本位于表格边缘下方 5 个像素处。

我在CSS中使用vertical-align：top，尝试过border-spacing：none，border-collapse：collapse和border：none。他们都没有解决问题。

使用边距顶部：-5px；标签上的 解决了标准浏览器测试中的问题，但某些电子邮件客户端不支持。

Answer 1

我是 Campaign Monitor 的 Ros。不完全明显的是和<多行>标签转换为

您的内容

...当导入到 Campaign Monitor 编辑器中时。就是这些

创建此额外填充的标记 - 这里有一个示例。

避免这种情况的最简单方法是添加 p { margin: 0;填充：0； } 到你的 CSS 样式。

希望这能为您解决这个问题。请注意，我们有一个论坛来回答此类问题，因此请随时在其中发布您的模板代码未来。

非常感谢所有在这里做出贡献的人！

Answer 2

Ros 的建议在大多数情况下就足够了，但 Gmail 会删除您的标头样式，从而使插入的 p 标签保留 Gmail 的默认页边距顶部和底部。

解决此问题的另一种方法是在多行标记中添加 div 标记。这将成功阻止 Campaign Monitor 用 ap 标签包装您的内容。

这是一个结构示例：

<multiline>
    <div>
        Your Content Goes Here.
    </div>
</multiline>

Answer 3

戴上

valign="top"

你的 TD 来记录文本。如果电子邮件客户端无法识别 CSS，它应该识别标准 HTML 属性。

另外，如果这不能解决问题，您可以编辑您的 Q 并添加您在该 .

Answer 4

我假设您指的是 H2 标签内的文本。

为

创建一个类，

.noPad  {
padding-top: 0px;
}

或者不使用 H2，而仅使用 span 或 div 元素。

Answer 5

它可能只是文本的行高，而不是边距/填充 - 也检查一下