0
Outlook을 제외하고이 HTML 전자 메일이 모든 클라이언트와 브라우저에서 제대로 표시되는 원인을 알고 있습니까? 제목은 위에 로고가 찍히고, 소셜 미디어 아이콘은 "Follow Us"아래에서 잘립니다.테이블 행이 겹쳐져 잘리는 Outlook
내가 그 행에 특정 코드를 포함 시켰습니다 :
<body width="100%" bgcolor="#ffffff" style="margin: 0; mso-line-height-rule: exactly;">
<center style="width: 100%; background: #ffffff; text-align: left;"><!--
Set the email width. Defined in two places:
1. max-width for all clients except Desktop Windows Outlook, allowing the email to squish on narrow but never go wider than 600px.
2. MSO tags for Desktop Windows Outlook enforce a 600px width.
-->
<div class="email-container" style="max-width: 600px; margin: auto;"><!--[if mso]>
<table role="presentation" aria-hidden="true" cellspacing="0" cellpadding="0" border="0" width="600" align="center">
<tr>
<td>
<![endif]--><!-- Email Header : BEGIN -->
<tr>
<td height="36" style="font-size: 0; line-height: 0; min-height: 36px !important;"> </td>
</tr>
<table align="center" aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width: 600px;" width="100%">
<tr>
<td style="text-align: center" class=""><img alt="logo" aria-hidden="true" border="0" src="logo.jpg" style="display: block; background: rgb(255, 255, 255); border-width: 0px; border-style: solid; width: 181px; min-height: 45px; line-height: 1.4em;" height="45" width="181"></td>
</tr>
</table>
<tr>
<td height="56" style="font-size: 0; line-height: 0; min-height: 56px !important;"> </td>
</tr>
<table aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" width="90%">
<tr>
<td height="43" style="font-size: 0; line-height: 0; min-height: 43px !important;"> </td>
</tr>
<tr>
<td align="center" class="stack-column-center" style="font-family: sans-serif; line-height: 1.4em; color: #777; padding: 0px 20px 0px 20px; overflow: hidden;">
<h2 style="font-size: 15px; text-transform: uppercase; text-align: center;">Follow us</h2><br>
</td>
</tr>
<tr>
<td height="27" style="font-size: 0; line-height: 0; min-height: 27px;"> </td>
</tr>
<tr><td align="center" class="stack-column-center" style="display: block; font-family: sans-serif; line-height: 1.4em; color: #777; padding: 0px 20px 0px 20px; min-height: 60px;">
<a href="link"><img alt="LinkedIn social icon" aria-hidden="true" border="0" src="link" style="line-height: 1.4em; min-height: 29px; background: #fff; padding: 0 11px;" width="29" height="29"></a> <a href="link"><img alt="YouTube social icon" aria-hidden="true" border="0" src="link" style="min-height: 29px; background: #fff; padding: 0 11px;" width="29" height="29"></a> <a href="link"><img alt="Facebook social icon" aria-hidden="true" border="0" src="link" style="min-height: 29px; background: #fff; padding: 0 11px;" width="29" height="29"></a> <a href="link">
<img alt="Twitter social icon" aria-hidden="true" border="0" src="linhk" style="min-height: 29px; background: #fff; padding: 0 11px;" width="29" height="29"></a></td>
</tr>
<tr>
<td height="43" style="font-size: 0; line-height: 0; min-height: 43px !important;"> </td>
</tr>
</table>
죄송합니다. 나는 작동하지 않는 코드의 부분 만 붙여 넣었지만 부모 요소를 유지할 수있었습니다. 고맙습니다. 그것들을 px로 바꾸어서 나를 위해 고쳐 놓은 것처럼 보이지만, 여러분의 테이블 align = "center"는 정렬을 고정시킵니다! – flexlearn