Gmail의 Android에서 100 % 너비 테이블이 작동하지 않습니다.

Android 용 Gmail에서 공동 작업하지 않는 일부 작은 조각을 제외하고는 반응 형 이메일을 구축하려고합니다.Gmail의 Android에서 100 % 너비 테이블이 작동하지 않습니다.

나는 장식 요소로 이메일의 상단에 앉아이 심각하게 간단한 검은 줄무늬가 있습니다

<table width="100%" cellpadding="0" cellspacing="0" align="center" valign="top"> 
    <tr><td width="100%" height="11" bgcolor="#000000"></td></tr> 
    <tr><td width="100%" height="2" bgcolor="#FFFFFF"></td></tr> 
    <tr><td width="100%" height="1" bgcolor="#000000"></td></tr> 
    <tr><td width="100%" height="30" bgcolor="#FFFFFF"></td></tr> 
</table>

을하지만 그들은 닮은 검은 색의 작은 스트립보다 더 아무것도과 흰색으로 표시되지 않습니다 Gmail Android 앱에서 매우 얇은 느낌표입니다. 이 이메일의 전체 폭에 걸쳐 만드는 방법에

<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#000000"> 
    <tr> 
     <td> 

     <table width="650" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#000000"> 
      <tr> 
       <td align="right" class="footer"> 
        <img src="images/footer.png" /> 
       </td> 
      </tr> 
     </table> 

     </td> 
    </tr> 
</table>

어떤 제안 :

마찬가지로, 이메일의 전체 폭에 걸쳐되지 않은 글이있다?

출처

2014-09-02 nebulousecho

@Fabio HTML5는 확실히 이메일 클라이언트에서 지원되지 않습니다. 전자 메일의 경우 불행히도 "가장 중요하지 않은"코드를 사용하는 것이 가장 좋습니다. http://stackoverflow.com/questions/2935472/html-email-tables-or-divs – rds

+10

해결책을 찾지 못한 경우

... 이 문제를 해결하기 위해 노력하고 있습니다. 지금. Gmail은 대부분의 CSS를 없애고 싶지만 라벨을 추가하면 중요한 메일은 시간을 많이두고, 1366px (내 화면 크기)로 100 % 생성하도록 메일을 보내지 만 가로 스크롤바가 남습니다. 전체 솔루션을 찾은 경우 여기에 게시합니다.또는 당신이 그것을 풀었다면 나는 알고 싶습니다. 다른 이메일에서도 가능하다는 것을 알았습니다. – JoeyPhillips

@JoeyPhillips 이것은 나를 위해 일했습니다! 정답에 대한 크레딧을받을 자격이 있습니다. 열쇠는 실제로 style 속성 내의 width 선언에 중요합니다! 이것을 공유해 주셔서 감사합니다. –

답변

당신은 솔루션

스타일 = 시도 발견되지 않은 경우 "폭 :! 100 % 중요합니다"와 같은

<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#000000" style="width:100%!important">

의 Gmail은 CSS의 대부분을 제거하기를 좋아하지만,

당신은 라벨을 추가하는 경우 ! important는 대부분 시간을 지켜줍니다.

출처

2014-09-26 20:09:06 JoeyPhillips

이것은 올바른 대답으로 표시되어야합니다! 그것은 내가 추적 할 수없는 그 성가신 문제의 또 다른 하나 였지만, 이것으로 해결되었습니다! –

이것은 지난 주 동안 나를 좌절 시켰습니다. Gmail에서이 문제를 해결하길 바랍니다. 고맙습니다! –

작동이 중단 되었습니까? Gmail은 Android 클라이언트에서 내 테이블의 크기를 자동으로 조정하지만 사용자가 자동 크기 조정을 사용 중지하여 문제를 해결할 수있는 옵션을 제공합니다 ... – MatheusJardimB

저는 PC 용으로 설계되지 않은 것을 클라이언트/사이트/etc로 만드는 것에 익숙하지 않으므로이 방법이 작동하는지 여부는 확실하지 않지만 이것을 시도하십시오. 당신이 "테이블"요소의 기능을 상실하더라도

<center> 
<h1 style="color:#888888;">Android Client Header</h1> 
<p>Demonstration</p> 
</center> 
<hr color="#000000" style="height:11px;"> 
<hr color="#FF0000" style="height:2px;"> 
<hr color="#000000" style="height:1px;"> 
<hr color="#FF0000" style="height:30px;"> 

<h3 style="color:#0070ff;">Content 1</h3> 
<p color="#808080">E-mail Here</p> 
<hr color="#000000"> 
<center> 
<h1 style="color:#db880f;text-size:10px;">Android Client Footer</h1> 
<p style="color:#888888;">Demonstration</p> 
</center>

이 내가 라인 장식에 대한 귀하의 색상과 크기 설정을 대결하기 위해 최선을 노력하고, 함께 온 샘플 예이다.

출처

2014-09-24 14:15:12

광범위한 테스트를 거친 후 다음과 같은 솔루션은 모든 전자 메일 클라이언트 (Litmus에서 사용 가능)에서 수직 간격 문제에 대해 작동합니다. Andriod의 Gmail 앱.

<table width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100% !important;"> 
    <tr> 
     <td bgcolor="#00a0cc" height="25" style="background:#00a0cc;height:25px;line-height:0;font-size:0;">&nbsp;<br /></td> 
    </tr> 
</table>

키 포인트는 td에 적용되는 작동하지 않습니다, 테이블에 width:100% !important을 적용하는 것입니다. 수직 스페이서 이미지를 대체하기위한 최상의 솔루션이기도합니다.

출처

2015-02-17 04:10:39 Mark

따라서 100 % 최소 폭을 첨가하여 100 %를 의미 Gmail을시켜 100 % 우리 < 테이블 >한다.

source

출처

2015-09-25 09:32:57 insulaner

내 경우에는 작동합니다. 그런 다음 미디어 쿼리에서 min-width : 0을 추가하여 미디어 쿼리를 지원하는 전자 메일 클라이언트에 대해이 규칙을 제거 할 수 있습니다. – jarace87

이것은 내 문제의 누락 된 부분이었습니다! 필자는 항상 580px의 고정 너비 전자 메일 템플릿을 만들려고했지만 Gmail은이를 유동 너비 테이블로 변환했습니다. 'width : 580px! important; min-width : 580px! important;가 필요한 것입니다. 건배! –

Gmail의 Android에서 100 % 너비 테이블이 작동하지 않습니다.

답변

관련 문제