订阅者电子邮件:GMail将高度转换为最小高度

Question

在向Google用户发送电子邮件时,这是一个看似已知的问题:Google将任何"高度"声明更改为"最小高度".这意味着堆叠的图像不再没有间隙地相互"接触".

有谁知道一个好的工作？

这是一个例子:

<div style="height:244px">
    <img src="http://www.domain.com/images/top.gif" alt="" />
</div>
<div style="height:266px">
    <img src="http://www.domain.com/images/bottom.gif" alt="" />
</div>

在GMail中显示如下:

<div style="min-height:244px">
    <img src="http://www.domain.com/images/top.gif" alt="" />
</div>
<div style="min-height:266px">
    <img src="http://www.domain.com/images/bottom.gif" alt="" />
</div>

所以不是这样的:

在GMail中,两个堆叠在一起的图像看起来像这样:

必须有一个简单的解决方法？

Answer 1

我刚刚遇到这个问题并通过设置max-height它没有搞乱来解决它.

Answer 2

添加vertical-align: top,display: block或float: left在图像上.

默认情况下,图像是内联块,并与文本基线对齐.这意味着如果您要在它们旁边放置任何文本,图像的底部会与"x"的底部对齐,而不是"y"的底部.这个下降器的"预留空间"是导致图像之间空间的原因.

我上面提到的任何一个属性声明都会阻止图像与文本基线对齐,所有这些都以不同的方式进行.

Answer 3

我注意到GMail不会干扰<td height="...">属性设置.如果您可以轻松地将有问题的元素分配到表中,那么这可能是一种解决方法.