Я создал html-адрес электронной почты, используя таблицы. Он отлично отображается в браузерах, но когда я просматриваю его в outlook.com, gmail и Outlook, есть горизонтальные «пробелы», таблица также кажется более широким (справа) и длиннее (внизу).html таблица электронной почты, показывающая пробелы в outlook.com и gmail
Я долгое время искал в Интернете ответ, не добившийся успеха, и попробовал много разных вещей (я новичок в html). Я попытался поместить таблицу в другой контейнер таблицы, я удалил промежутки между tds, я добавил контейнер абзаца вокруг изображений (который фиксировал один из пробелов в gmail, но создал другой в Outlook-клиенте, которого раньше не было). Все мои ячейки имеют ширину и высоту, как и моя таблица. Я установил прописку, границы и т. Д. 0. Я попытался добавить отображение: блок для каждого изображения, но он вытолкнул всю таблицу горизонтально и сделал ее смехотворно широкой.
У меня нет идей! Пожалуйста, помогите, поскольку мне нужно разобраться с этой проблемой, но я еще не добавил текст. Я включил здесь свой код. Большое спасибо.
<!-- Save for Web Slices (AP-MelbourneCup14-4.psd) -->
<table id="table_01" width="100%" height="100%"><table id="Table_02" width="510" height="818" border="0" style="border-spacing:0" cellpadding="0" cellspacing="0" bgcolor="#F0f0f0" align="center">
\t <tr>
\t \t <td colspan="6" width="510" height="19"></td>
\t </tr>
\t <tr>
\t \t <td width="510" height="75" colspan="6"><p style="margin:0; font-size:0px; line-height:0"><img id="AP_MelbourneCup14_4_02" src="images/AP-MelbourneCup14-4_02.png" width="510" height="75" alt="" border="0"/></td>
\t </tr>
\t <tr>
\t \t <td colspan="6" width="510" height="76"></td>
\t </tr>
\t <tr>
\t \t <td rowspan="9" width="22" height="521"></td>
\t \t <td rowspan="3" width="355" height="225" bgcolor="#f0f0f0"><p style="margin:0; font-size:0px; line-height:0"><img id="AP_MelbourneCup14_4_05" src="images/AP-MelbourneCup14-4_05.png" width="355" height="225" alt="" border="0"/></td>
\t \t <td colspan="4" width="133" height="107"></td>
\t </tr>
\t <tr>
\t \t <td colspan="3" width="108" height="87" bgcolor="#000000"></td>
\t \t <td rowspan="8" width="25" height="414"></td>
\t </tr>
\t <tr>
\t \t <td colspan="3" rowspan="2" width="108" height="56"></td>
\t </tr>
\t <tr>
\t \t <td width="355" height="25"></td>
\t </tr>
\t <tr>
\t \t <td colspan="2" width="398" height="33" bgcolor="#303473"></td>
\t \t <td colspan="2" width="65" height="33"></td>
\t </tr>
\t <tr>
\t \t <td rowspan="4" width="355" height="238"><p style="margin:0; font-size:0px; line-height:0"><img id="AP_MelbourneCup14_4_13" src="images/AP-MelbourneCup14-4_13.png" width="355" height="238" alt="" border="0"/></td>
\t \t <td colspan="2" width="57" height="57"><p style="margin:0; font-size:0px; line-height:0"><img id="AP_MelbourneCup14_4_14" src="images/AP-MelbourneCup14-4_14.png" width="57" height="57" alt="" border="0"/></td>
\t \t <td rowspan="2" width="51" height"112"></td>
\t </tr>
\t <tr>
\t \t <td colspan="2" width="57" height="55"></td>
\t </tr>
\t <tr>
\t \t <td colspan="3" width="108" height="87" bgcolor="#000000"></td>
\t </tr>
\t <tr>
\t \t <td colspan="3" width="108" height="39"></td>
\t </tr>
\t <tr>
\t \t <td colspan="6" width="510" height="105"><p style="margin:0; font-size:0px; line-height:0"><img src="images/AP-MelbourneCup14-4_19.png" alt="" width="510" height="105" align="bottom" id="AP_MelbourneCup14_4_19" border="0"/></p></td>
\t </tr>
\t <tr>
\t \t <td colspan="6" width="510" height="22" bgcolor="#0697d4"></td>
\t </tr>
</table> </table>
<!-- End Save for Web Slices -->
Существует высказывание о кодировании электронных писем - никогда не пытайтесь делать это с нуля. Я очень рекомендую использовать библиотеку для этого. –