Gmail에 spacer.gif가 포함 된 TD를 16px 높이로 넣으려고

Question

그래서 나는이 전투에서 이기기 위해 몇 시간을 잃었습니다. 운이 없었습니다. 요약하면, 나는 3 개의 10px 이미지를 가진 테이블을 채우려고 노력하고 있지만, GMail은 각 셀을 16px로 만듭니다. 여기에 내가 함께 일하고있다 :

<table border="0" cellpadding="0" cellspacing="0" width="550" style="height:10px !important"> 
    <tr style="height:10px" height="10"> 
    <td width="10" height="10" style="height:10px !important"> 
     <img src="http://s3.amazonaws.com/meagain/images/templates/letterhead/corner_tl.gif" style="display:inline; padding: 0px; margin:0px" width="10px" height="10px"></td> 
    <td width="531" height="10" style="height:10px !important; background-color:#FFFFFF;"> 
     <img src="http://s3.amazonaws.com/meagain/images/templates/letterhead/spacer.gif" style="display:inline; padding: 0px; margin:0px" width="10px" height="10px"></td> 
    <td width="9" height="10" style="height:10px !important"> 
     <img src="http://s3.amazonaws.com/meagain/images/templates/letterhead/corner_tr.gif" style="display:inline; padding: 0px; margin:0px" width="9px" height="10px"></td> 
    </tr> 
</table> 

나는 많은 것을 시도해 왔기 때문에 많은 중복 속성이 있다는 것에 사과한다. 기본적으로 테이블을 정확히 10px 높이로 만들려고합니다. 상관없이, 그러나, Gmail은 그것을 16px 높이합니다. 개발자 도구를 사용하여 소스 코드에서 세 개의 이미지를 모두 삭제하면 표가 10 픽셀로 축소됩니다. 또한 3 개의 이미지 중 2 개를 삭제하면 16 픽셀로 유지됩니다. 이미지에 이미지가 있거나 이미지 주위에 3 픽셀의 패딩이있는 경우 TD가 16 픽셀이어야하는 것과 같습니다.

경험이있는 사람이 있습니까? 그리고 그렇다면 어떤 아이디어입니까? 나는 아직 언급 할 수

Answer 1

Herbie와 마찬가지로 TD에 선 높이를 설정해야합니다.

gmail이 해당 셀의 공백 문자를 기반으로 TD의 최소 높이를 설정하고 있기 때문에 글꼴 크기가 설정되어 있는지 확인하십시오. 일반적으로 텍스트가없는 셀의 글꼴 크기를 1px로 설정하는 것이 좋습니다.

html 이메일 작성에 사용 된 것 같습니다. 맞습니까? 다른 문제에 대해서는이 부분을 살펴보십시오. 팁을 얻으려면 http://www.emailology.org/#1 및 http://www.campaignmonitor.com/resources/ 번을 도와줍니다.

Answer 2

.. 아이디어, 정신의 부족, 그래서 나는

16px

는 라인 높이 값 같은데 ... 답변으로 게시합니다. 각 TD의 라인 높이를 10px로 설정하거나 각 IMG를 인라인에서 인라인 블록으로 변경해 보았습니까?

Answer 3

나는 해결책을 찾아 내려고했습니다.

이것은 문자 그대로의 솔루션입니다, 당신의 TD 태그에 넣고 :

style="display:block;" 

을 ...하거나 높이를 만들 수 있습니다

style="line-height:0" 

Answer 4

당신의 <img> 태그에서는이를 넣을 수 있습니다 max-height. 그것은 당신의 문제를 해결해야합니다.

HTML에서

Answer 5

는 - 우리가 당신의 주어진 높이가 완벽하게 HTML 페이지에서 작동 CSS 블록 태그이와

style="display:block;" 

처럼 작동하게하려면 다음 CSS를 사용해야하므로 <img> 태그는 블록 태그 아니다 .

한 번 시도해보십시오!