html - 出于某种原因，我 table 上的一张图片向左倾斜和拥抱

Question

我正在用 3 张图片设置 2 行表格的格式，但每行中的第 2 张图片不断向下倾斜并朝向错误的方向。我不确定是什么原因造成的。

这是用于电子邮件的，我只是试图挑选一些模板以更好地满足我的需求，因此所有内联 CSS ..responsiveColumn 类仅用于媒体查询，仅供引用。

<!-- 2nd Image -->
<td style="background-color: #ffffff; color: #000000;" class="responsiveColumn" width="34%" valign="top" bgcolor="#ffffff">
<table cellspacing="0" cellpadding="0" border="0" height="100%" width="100%">
<tbody>
<tr>
<td style="padding-top: 20px; padding-right: 5px; padding-bottom: 20px; padding-left: 5px; background-color: #ffffff; color: #000000;" valign="top" bgcolor="#ffffff">
<div class="" style="">
<table cellspacing="0" cellpadding="0" border="0" width="100%" style="word-wrap: break-word; table-layout: fixed;">
<tbody>
<tr>
<td>
<p style="text-align: center;">
<a href="link.html" target="_blank"><img alt="Metro PCS" src="https://via.placeholder.com/175x150" style="border: 0px solid #000000; display: block;" width="175" height="150"></p>
</td>
</tr>
</tbody>
</table>
</div></td></tr>
</tbody></table></td>

我把它放在jsfiddle 中，这样你可以更清楚地看到它。您会看到每行中的第二张图像如何向下倾斜并向左移动，而不是将所有内容均匀地放在一行上

https://jsfiddle.net/9f5c2zh6/1/

Answer 1

移除 padding-top

<td style="padding-top: 20px;padding-right: 5px;padding-bottom: 20px;padding-left: 5px;background-color: #ffffff;color: #000000;" valign="top" bgcolor="#ffffff">