我正在制作时事通讯设计，我需要并排放置两张图片（在所附的屏幕截图下的Find a Camp Today部分下）。我正在使用table，tr和td。更确切地说，我使用两列表来放置我的图像。但桌面上的Outlook表现得非常奇怪。当我在这些图像上翻转鼠标时，图像的大小会发生变化，我感觉页面会跳跃。
在本节的顶部，有一个带有图像的三列部分。但是在鼠标悬停时效果非常好。
我甚至试图剥离我的代码，并从图像周围删除标签，但即使使用简单的标签也会产生同样的问题。有人可以帮忙吗？
<!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" xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<!--[if gte mso 9]><xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml><![endif]-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<style type="text/css">
@media only screen and (max-width: 480px) {
#header img {
width: 100% !important;
max-width: 600px !important;
}
#threeSteps img {
width: 50px !important;
height: auto !important;
}
}
</style>
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
table {border-collapse: collapse;}
</style>
<![endif]-->
</head>
<body style="margin: 0 !important; padding: 0; background-color: #284055;">
<center class="wrapper" style="width: 100%; table-layout: fixed; color: #284055; font-family:arial,'helvetica neue',helvetica,sans-serif;">
<div class="webkit" style="width: 100%; max-width: 600px; margin: 0 auto;">
<!--[if (gte mso 9)|(IE)]>
<table width="600" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
<tr>
<td>
<![endif]-->
<table width="95%" cellspacing="0" cellpadding="0" border="0"; class="outerTable" align="center" style="table-layout: fixed; max-width: 600px; Margin: 0 auto; border-collapse: collapse;">
<tbody>
<tr id = "preHeader">
<td style="padding: 18px 0 9px 0">
<table width="100%" cellspacing="0" cellpadding="0" border="0" style="border-collapse: collapse;">
<tbody>
<tr>
<td style="width: 55%;">
<div>
<a href="http://www.ussportscamps.com/" target="_blank"><img align="none" height="52" src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/c92fc6ee-674b-4bde-8dce-096423d1f338.png" style="width: 150px; height: 52px; margin: 0px;" width="150"></a>
</div>
<p style="margin-top: 3px;color: #FFFFFF; font-size:10px;">Offering the best locations across the country</p>
</td>
<td style="width: 45%; text-align: right">
<div class="phoneNo" style="text-align: right;">
<img align="none" src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/936029f6-3875-447b-a16b-8d5f56dc1019.png" style="width: 12px; height: 12px; margin: 0px; margin-right:3px;">
<span style="color: #FFFFFF; font-family:arial,helvetica neue,helvetica,sans-serif; line-height: 14px;"><a href="#" style="display:table-cell; font-size:14px; vertical-align:middle; color: #FFFFFF; text-decoration: none;">1-800-645-3226</a></span>
</div>
</td>
</tr>
</tbody>
</table>
</tr>
</tbody>
<tr id="header">
<td>
<a href="" style="display: block;"><img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/fbab6265-6181-4b4a-a23e-f0b120c63bb5.jpg" width="600" style="display: block; width: 100%; max-width: 600px;"></a>
</td>
</tr>
<tr id="introText" style="background-color: #FFFFFF; border: 1px solid #FFFFFF; border-left: 0; border-right: 0;">
<td>
<p style="padding: 18px; color: #97a5b1; font-size: 16px; line-height: 22px; text-align: center;">Searching for a camp at a top college? Looking for something at a driving distance from your local community? We’ve got all your needs covered.</p>
</td>
</tr>
<tr id="threeSteps" style="background-color: #FFFFFF; border: 1px solid #FFFFFF; border-left: 0; border-right: 0;">
<td>
<table width="90%" cellspacing="0" cellpadding="0" border="0" style="width: 90%; margin: auto; border-collapse: collapse; line-height: 16px;">
<tbody>
<tr style="text-align: center;">
<td width="33.33%" valign="top">
<div style="margin: 0 10px">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/a4274d78-edd8-4fb0-a184-07a14a61658d.png">
<p style="font-size: 12px;">Select a Sport</p>
</div>
</td>
<td width="33.33%" valign="top">
<div style="margin: 0 10px">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/29b4889a-f35c-438e-b888-9d3bc52f9e36.png">
<p style="font-size: 12px;">Explore Programs & Locations</p>
</div>
</td>
<td width="33.33%" valign="top">
<div style="margin: 0 10px">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/70d34e64-3c9f-4b55-a1ec-39cb24ec4873.png">
<p style="font-size: 12px;">Reserve your camp</p>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr id="learnMoreLink" style="background-color: #FFFFFF; border: 1px solid #FFFFFF; border-right: 0; border-left: 0;">
<td>
<div style="padding-top: 12px; text-align: center;">
<a href="#" style="text-decoration: none;"><span style="color: #2982cf; font-size: 12px;">Learn More</span></a>
</div>
</td>
</tr>
<tr class="separator" style="background-color: #FFFFFF; border: 1px solid #FFFFFF; border-right: 0; border-left: 0;">
<td>
<hr style="width: 90%; margin: 30px auto; border: 0; border-top: 1px solid #e9ecee;">
</td>
</tr>
<tr id="sportsWidgetHeading" style="background-color: #FFFFFF; border: 1px solid #FFFFFF; border-left: 0; border-right: 0;">
<td>
<h2 style="margin: 0; color: #284055; font-size: 16px; text-align: center; text-transform: uppercase;">Find a Camp Today</h2>
</td>
</tr>
<tr id="sportsWidgets" style="background-color: #FFFFFF; border: 1px solid #FFFFFF; border-left: 0; border-right: 0;">
<td>
<table width="90%" cellspacing="0" cellpadding="0" border="0" style="max-width: 580px; margin: 20px auto;">
<tbody>
<tr>
<td width="49%;" style="width: 49%;">
<div style="padding-right: 9px; padding-bottom: 18px;">
<a href="http://www.ussportscamps.com/tennis/" target="_blank" style=" text-decoration: none;">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/aee9ab4d-d626-43c0-924a-2808c3bf32f7.jpg" style="display: block; width: 100%; max-width: 264px; margin:0;">
<div style="margin: 0; padding: 7px; border-bottom: 3px solid #d4d9dd; color: #FFFFFF;font-family: Helvetica;font-size: 12px;font-weight: normal;text-align: left; text-transform: uppercase; background-color: #e97526;"><span>Tennis Camps</span>
</div>
</a>
</div>
</td>
<td width="49%;" style="width: 49%;">
<div style="padding-left: 9px; padding-bottom: 18px;">
<a href="http://www.ussportscamps.com/tennis/" target="_blank" style=" text-decoration: none;">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/aee9ab4d-d626-43c0-924a-2808c3bf32f7.jpg" style="display: block; width: 100%; max-width: 264px; margin:0;">
<div style="margin: 0; padding: 7px; border-bottom: 3px solid #d4d9dd; color: #FFFFFF;font-family: Helvetica;font-size: 12px;font-weight: normal;text-align: left; text-transform: uppercase; background-color: #e97526;"><span>Tennis Camps</span>
</div>
</a>
</div>
</td>
</tr>
<tr>
<td width="49%;" style="width: 49%;">
<div style="padding-right: 9px; padding-bottom: 18px;">
<a href="#" target="_blank" style=" text-decoration: none;">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/aee9ab4d-d626-43c0-924a-2808c3bf32f7.jpg" style="display: block; width: 100%; max-width: 264px; margin:0;">
<div style="margin: 0; padding: 7px; border-bottom: 3px solid #d4d9dd; color: #FFFFFF;font-family: Helvetica;font-size: 12px;font-weight: normal;text-align: left; text-transform: uppercase; background-color: #e97526;"><span>Tennis Camps</span>
</div>
</a>
</div>
</td>
<td width="49%;" style="width: 49%;">
<div style="padding-left: 9px; padding-bottom: 18px;">
<a href="#" target="_blank" style=" text-decoration: none;">
<img src="https://gallery.mailchimp.com/29e5ee226282df721575ec2a2/images/aee9ab4d-d626-43c0-924a-2808c3bf32f7.jpg" style="display: block; width: 100%; max-width: 264px; margin:0;">
<div style="margin: 0; padding: 7px; border-bottom: 3px solid #d4d9dd; color: #FFFFFF;font-family: Helvetica;font-size: 12px;font-weight: normal;text-align: left; text-transform: uppercase; background-color: #e97526;"><span>Tennis Camps</span>
</div>
</a>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</div>
</center>
</body>