我在这里寻找答案，但没有找到任何答案。 我的电子邮件的不同部分之间有一些奇怪的间距/间隙。我检查了任何填充，边距，间距或边框，但我无法解决问题。
我真的不知道该怎么做..
http://i.stack.imgur.com/PqSgX.jpg
以下是整个代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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"/>
<title>VG Divendoor - mojaskrina.sk</title>
<style type="text/css">
/*////// RESET STYLES //////*/
body, #bodyTable, #bodyCell{height:100% !important; margin:0; padding:0; width:100% !important;}
table{border-collapse:collapse;}
img, a img{border:0; outline:none; text-decoration:none;}
h1, h2, h3, h4, h5, h6{margin:0; padding:0;}
/*////// CLIENT-SPECIFIC STYLES //////*/
.ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Hotmail/Outlook.com to display emails at full width. */
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div{line-height:100%;} /* Force Hotmail/Outlook.com to display line heights normally. */
table, td{mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up. */
#outlook a{padding:0;} /* Force Outlook 2007 and up to provide a "view in browser" message. */
img{-ms-interpolation-mode: bicubic;} /* Force IE to smoothly render resized images. */
body, table, td, p, a, li, blockquote{-ms-text-size-adjust:100%; -webkit-text-size-adjust:100%;} /* Prevent Windows- and Webkit-based mobile platforms from changing declared text sizes. */
/*////// FRAMEWORK STYLES //////*/
.flexibleContainerCell{padding-top:10px; padding-Right:20px; padding-Left:20px;}
.flexibleImage{height:auto;}
.bottomShim{padding-bottom:20px;}
.imageContent, .imageContentLast{padding-bottom:20px;}
.nestedContainerCell{padding-top:20px; padding-Right:20px; padding-Left:20px;}
/*////// GENERAL STYLES //////*/
body, #bodyTable{background-color:#6c6c6c;}
#bodyCell{padding-top:20px; padding-bottom:40px;}
h1, h2, h3, h4, h5, h6{color:#202020; font-family:Helvetica; font-size:18px; line-height:100%; text-align:Left;}
.textContent, .textContentLast{color:#404040; font-family:Helvetica; font-size:16px; line-height:125%; text-align:Left; padding-bottom: 0px;}
.textContent a, .textContentLast a{color:#2C9AB7; text-decoration:underline;}
.nestedContainer{background-color:#E5E5E5; border:1px solid #CCCCCC;}
/*////// MOBILE STYLES //////*/
@media only screen and (max-width: 680px){
/*////// CLIENT-SPECIFIC STYLES //////*/
body{width:100% !important; min-width:100% !important;} /* Force iOS Mail to render the email at full width. */
/*////// FRAMEWORK STYLES //////*/
/*
CSS selectors are written in attribute
selector format to prevent Yahoo Mail
from rendering media query styles on
desktop.
*/
table[id="emailBody"], table[class="flexibleContainer"]{width:100% !important;}
/*
The following style rule makes any
image classed with 'flexibleImage'
fluid when the query activates.
Make sure you add an inline max-width
to those images to prevent them
from blowing out.
*/
img[class="flexibleImage"]{height:auto !important; width:100% !important;}
/*
Make buttons in the email span the
full width of their container, allowing
for left- or right-handed ease of use.
*/
table[class="emailButton"]{width:100% !important;}
td[class="buttonContent"]{padding:0 !important;}
td[class="buttonContent"] a{padding:15px !important;}
td[class="textContentLast"], td[class="imageContentLast"]{padding-top:20px !important;}
/*////// GENERAL STYLES //////*/
td[id="bodyCell"]{padding-top:10px !important; padding-Right:10px !important; padding-Left:10px !important;}
}
</style>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable">
<tr>
<td align="center" valign="top" id="bodyCell">
<!-- EMAIL CONTAINER // -->
<!--
The table "emailBody" is the email's container.
Its width can be set to 100% for a color band
that spans the width of the page.
-->
<table border="0" cellpadding="0" cellspacing="0" width="600" id="emailBody">
<!-- MODULE ROW // -->
<!--
To move or duplicate any of the design patterns
in this email, simply move or copy the entire
MODULE ROW section for each content block.
-->
<tr>
<td align="center">
<!-- CENTERING TABLE // -->
<!--
The centering table keeps the content
tables centered in the emailBody table,
in case its width is set to 100%.
-->
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" valign="top">
<!-- FLEXIBLE CONTAINER // -->
<!--
The flexible container has a set width
that gets overridden by the media query.
Most content tables within can then be
given 100% widths.
-->
<table border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td align="center" valign="top" width="600" >
<!-- CONTENT TABLE // -->
<!--
The content table is the first element
that's entirely separate from the structural
framework of the email.
-->
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>
<a href="http://www.mojaskrina.sk/"><img src="http://www.mediafire.com/convkey/0d4b/achw81nuavm345cfg.jpg" alt="Mojaskrina.sk | jeden priestor - tisíc možností"></a>
</td>
</tr>
<tr>
<td background="http://www.mediafire.com/convkey/0563/moeszz5zt3vyn4ofg.jpg" style="padding: 20px; background-repeat: no-repeat; ">
<h1 style="color:#5c5c5c; text-transform: uppercase; margin-bottom: -10px;">Ďakujeme Vám za prejavený záujem o naše služby!</h1>
<p style=" font-family: Arial, Helvetica, sans-serif; color:#5c5c5c; line-height: 20px">Posielame Vám grafický návrh s cenou na vstavanú skriňu podľa požiadavky.
Ceny sú vrátane DPH, zamerania, dopravy, montáže a aktuálnej zľavy. Cena sa spresní po zameraní. Zameranie prevedieme zvyčajne do 5 pracovných dní od objednania a zloženia zálohy, montáž 4 týždne
od zloženia zálohy. Pri objednávke sa skladá záloha vo výške 40% z celkovej kalkulovanej ceny, zvyšok sa platí po montáži skrine priamo technikovi, ktorý Vám zároveň odovzdá dodací list, faktúru, záručný list
a preberací protokol.</p>
</td>
</tr>
<tr>
</table>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="150" >
<a href="http://www.mojaskrina.sk/spalne-postele/postele/"><img src="http://www.mediafire.com/convkey/fc30/ixe77cwhanckebcfg.jpg" alt="Postele na mieru"></a>
</td>
<td width="150" >
<a href="http://www.mojaskrina.sk/spalne-postele/nocne-stoliky/"><img src="http://www.mediafire.com/convkey/7a17/vqj0ebhgafvvdrwfg.jpg" alt="Nočné stolíky"></a>
</td>
<td width="150" >
<a href="http://www.mojaskrina.sk/spalne-postele/komody/"><img src="http://www.mediafire.com/convkey/e12c/gm6w81oiqmcza2ufg.jpg" alt="Komody"></a>
</td>
<td width="150" >
<a href="http://www.mojaskrina.sk/spalne-postele/vesiakove-steny/"><img src="http://www.mediafire.com/convkey/e7e2/juzxq7zjv6z9zs0fg.jpg" alt="Vešiakové steny"></a>
</td>
</tr>
<tr>
<td>
<img src="http://www.mediafire.com/convkey/0966/3742rgmrt7tm7drfg.jpg" alt="Profesionalita"></td>
<td>
<img src="http://www.mediafire.com/convkey/f0e4/h6tmm0xha6s6leufg.jpg" alt="Spolahlivosť"></td>
<td>
<img src="http://www.mediafire.com/convkey/d4a4/vkpgbe2qkqpxrq4fg.jpg" alt="Tradícia"></td>
<td>
<img src="http://www.mediafire.com/convkey/3d46/3m1723tttcasscrfg.jpg" alt="Ceny"></td>
</tr>
<tr>
<td>
<img src="http://www.mediafire.com/convkey/6746/emxpawmymbha5ibfg.jpg" alt="Rýchlost"></td>
<td>
<img src="http://www.mediafire.com/convkey/ce5f/jy7iy61o0yr8b8ofg.jpg" alt="Záruka"></td>
<td>
<img src="http://www.mediafire.com/convkey/cd89/a18sfn2fdrcw1ozfg.jpg" alt="Servis"></td>
<td>
<img src="http://www.mediafire.com/convkey/3929/aj6jwkfzo8pk8pgfg.jpg" alt="Splátky"></td>
</tr>
</table>
</tr>
</table>
<!-- // CONTENT TABLE -->
<table border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td><a href="http://www.mojaskrina.sk/divendoor/skrine-na-splatky/"><img src="http://www.mediafire.com/convkey/0151/4jy39v9dgm3ep4tfg.jpg" alt="Nákup na splátky bez navýšenia"></td>
<td><a href="http://www.mojaskrina.sk/vstavane-skrine-navrhar/"><img src="http://www.mediafire.com/convkey/5fdb/i9a70bi9dng9jezfg.jpg" alt="Online návrh skrine"></a></td>
</tr>
</table>
<table valign="top" border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td height="105" background="http://www.mediafire.com/convkey/4ef5/l948a585o2rmxw9fg.jpg">
<a href="https://www.facebook.com/vstavanesatniky.sk"><img src="http://www.mediafire.com/convkey/8460/cddlbt0bx88ar8jfg.jpg" style="margin: 0 25px 0 25px; " alt="Facebook" /></a>
<a href="http://www.mojaskrina.sk/nase-predajne/"><img src="http://www.mediafire.com/convkey/2b2c/lazrad7327m6nlafg.jpg" alt="Kontakt" /></a>
<p style="margin: 0 50px 0 100px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFF; display:inline-block; width:140px; height:90px;">
VG Divendoor</br>
OD CENTRUM</br>
Zohorská 1, Bratislava</br>
02 65 411 174</br>
0911 48 16 58</br>
centrum@mojaskrina.sk</p>
<p style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFF; display:inline-block; width:140px; height:85px;">
VG Divendoor</br>
OC SARATOV</br>
Saratovská 9, Bratislava</br>
02 6436 0047</br>
0914 196 095</br>
saratov@mojaskrina.sk</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- // FLEXIBLE CONTAINER -->
</td>
</tr>
</table>
<!-- // CENTERING TABLE -->
</td>
</tr>
<!-- // MODULE ROW -->
</table>
<!-- // EMAIL CONTAINER -->
</td>
</tr>
</table>
</body>
答案 0 :(得分：0)
您的电子邮件编码方式存在很多问题。如果您想将它作为模板/指南使用，我会在Gist上发布一个模板...如果您使用此示例并重写您的电子邮件，您将不会遇到此问题而您实际上已经创建了一个更优越的电子邮件比你现在的电子邮件。
答案 1 :(得分：-1)
我认为问题在于您的不同部分位于不同的<table></table>元素中。
您应该将它们放在<div></div>标签中。
您还可以使用CSS来使用相对定位来准确更改块的位置。
希望这个帮助
修改
将其粘贴到存在错误的当前代码的位置：
<tr>
<td background="http://www.mediafire.com/convkey/0563/moeszz5zt3vyn4ofg.jpg"style="padding: 20px; background-repeat: no-repeat; ">
<h1 style="color:#5c5c5c; text-transform: uppercase; margin-bottom: -14px;">Ďakujeme Vám za prejavený záujem o naše služby!</h1>
<p style=" font-family: Arial, Helvetica, sans-serif; color:#5c5c5c;">
Posielame Vám grafický návrh s cenou na vstavanú skriňu podľa požiadavky.
Ceny sú vrátane DPH, zamerania, dopravy, montáže a aktuálnej zľavy. Cena sa spresní po zameraní. Zameranie prevedieme zvyčajne do 5 pracovných dní od objednania
a zloženia zálohy, montáž 4 týždne od zloženia zálohy. Pri objednávke sa skladá záloha vo výške 40% z celkovej kalkulovanej ceny, zvyšok sa platí po montáži skrine priamo technikovi, ktorý Vám zároveň odovzdá dodací list, faktúru, záručný list a preberací protokol.</p>
</td>
</tr>
很高兴这很有效。