Newletter - 고정 된 높이의 티저

Question

전자 메일 용 뉴스 레터 템플릿을 개발 중이며 특정 값보다 높을 수없는 테이블 행/div를 갖고 싶습니다. 그래야 텍스트가 표시되지 않습니다. 너무 길어. 그들은 모두가 모든 브라우저에서 미리보기에서 잘 작동

<table border="0" cellpadding="0" cellspacing="0" class="teaser" style="table-layout:fixed; overflow:hidden; white-space: nowrap;letter-spacing: -0.01em; border-collapse: collapse; font-family: arial; text-align: left; cursor: pointer; margin: 0px; padding: 0px; border: 0px;"> 
<tbody style="margin: 0px; padding: 0px; border: 0px;"> 
<tr> 
<td class="w480 normal-text" height="64" width="92" border="1" valign="top" align="left" style="color: #6f6f6f; font-size: 12px; line-height: 15px; border: #6f6f6f;"> 
<img src='testImage.jpg' alt='' /> 
</td> 
<td width="298" height="64" valign="top" style="color: #6f6f6f; border: #6f6f6f;"> 
<div style='height:64px; overflow:hidden;'> 
<h1 style="font-family: arial; font-size: 12px; font-weight: bold; line-height: 15px; vertical-align: top; text-transform: uppercase; margin: 0px; padding: 0px;"> 
<span style="color: #6f6f6f; line-height: inherit; text-decoration: none; position: relative; letter-spacing: 0.03em; top: -2px; margin: 0px; padding: 0px; border: 0px;"> 
Quias alitatem <br />qui cullat 
</span> 
</h1> 
<p class="normal-text no-overflow" style="font-size: 12px; line-height: 15px; margin: 4px 0px 0px;"> 
WelIpsamus pe invenda quiatur? Quias alitatem qui cullat lique num et molor sitempo rionse. WelIpsamus pe invenda quiatur? Quias alitatem qui cullat lique num et molor sitempo rionse. 
</p> 
</div> 
</td> 
</tr> 
</tbody> 
</table> 

: 전용 테이블로 : 테이블과 div를 가진

<table border="0" cellpadding="0" cellspacing="0" class="teaser" style="table-layout:fixed; overflow:hidden; white-space: nowrap;letter-spacing: -0.01em; border-collapse: collapse; font-family: arial; text-align: left; cursor: pointer; margin: 0px; padding: 0px; border: 0px;"> 
<tbody style="margin: 0px; padding: 0px; border: 0px;"> 
<tr> 
<td class="w480 normal-text" height="64" width="92" border="1" valign="top" align="left" style="color: #6f6f6f; font-size: 12px; line-height: 15px; border: #6f6f6f;"> 
<a href="#" target="blank" style="border:0px;text-decoration:none;color: #6f6f6f;"> 
<img src='testImage.jpg' alt='' style='border:0px' /> 
</a> 
</td> 
<td width="298" height="64" valign="top" style="color: #6f6f6f; border: #6f6f6f;"> 
<h1 style="font-family: arial; font-size: 12px; font-weight: bold; line-height: 15px; vertical-align: top; text-transform: uppercase; margin: 0px; padding: 0px;"> 
<a href="#" target="blank"> 
<span style="color: #6f6f6f; line-height: inherit; text-decoration: none; position: relative; letter-spacing: 0.03em; top: -2px; margin: 0px; padding: 0px; border: 0px;"> 
Quias alitatem <br />qui cullat 
</span> 
</a> 
</h1> 
<a href="#" target="blank" style="border:0px;text-decoration:none;"> 
<p class="normal-text no-overflow" style="font-size: 12px; line-height: 15px; overflow: hidden; margin: 4px 0px 0px;color: #6f6f6f"> 
WelIpsamus pe invenda quiatur? Quias alitatem qui cullat lique num et molor sitempo rionse. WelIpsamus pe invenda quiatur? Quias alitatem qui cullat lique num et molor sitempo rionse. 
</p> 
</a> 
</td> 
</tr> 
</tbody> 
</table> 

는 지금까지 두 개의 서로 다른 접근 방식을 시도했다. 그러나 이메일이 수신되면 row/div의 높이는 존중되지 않습니다. 원하는 결과를 얻는 방법이 있습니까?

Answer 1

시도 table-layout:fixed;. 테이블이 내용보다 우선하게됩니다.

전자 메일에서 100 % 지원되는지 확실하지 않으므로 테스트 방법을 알려주십시오.