HTML 전자 메일에서 이미지 사이에 공백을 추가하는 AOL

클라이언트 용 테이블이있는 전자 메일을 만들었지 만 AOL에서 테스트 할 때 이미지 사이에 여분의 패딩이 추가됩니다. 그것은 여기에 ... 각 이미지의 오른쪽에 추가되고있는 3px의 공간처럼 보이는 내 코드입니다 :HTML 전자 메일에서 이미지 사이에 공백을 추가하는 AOL

<table border="0" cellspacing="0" cellpadding="0" align="center" width="700" valign="top"> 
    <tr> 
     <td> 
      <img src="images/nav-gaming.jpg" align="left" style="display:block; vertical-align:bottom" width="104" height="33" border="0" /> <img src="images/nav-poker.jpg" align="left" style="display:block; vertical-align:bottom" width="104" height="33" border="0" /> <img src="images/nav-restaurant.jpg" align="left" style="display:block; vertical-align:bottom" width="102" height="33" border="0" /> <img src="images/nav-tanzibar.jpg" align="left" style="display:block; vertical-align:bottom" width="92" height="33" border="0" /> <img src="images/nav-events.jpg" align="left" style="display:block; vertical-align:bottom" width="82" height="33" border="0" /> <img src="images/nav-packages.jpg" align="left" style="display:block; vertical-align:bottom" width="96" height="33" border="0" /> <img src="images/nav-rewards.jpg" align="left" style="display:block; vertical-align:bottom" width="120" height="33" border="0" /> 
     </td> 
    </tr> 
</table>

내가 눈부시게 명백한 놓친 적이 있습니까? 테이블의 새로운 td에 각 이미지를 추가하여 테스트했지만 동일한 문제가 발생합니다.

출처

2013-09-04 Anonymous

마크 업에서 이미 이미지 사이의 공백을 제거하려고 시도 했습니까? – fcalderan

예 - 있습니다. 소용이 없습니다 = ( 링크를 제공해 주셔서 감사합니다. Nathan, 나는 그것을 보지 못했습니다. :) –

불행히도 Nathan은 채팅룸에서 충분한 평판을 얻지 못했습니다. –

자신의 테이블 셀에 이미지를 넣어 항상 안전 : 당신이 (당신이 display:block;을 제거 할 필요가 떠있는) 이미지를 떠하려는 경우

<table border="0" cellspacing="0" cellpadding="0" width="700"> 
    <tr> 
    <td> 
     <img src="images/nav-gaming.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="104" height="33" border="0" /> 
    </td> 
    <td> 
     <img src="images/nav-poker.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="104" height="33" border="0" /> 
    </td> 
    <td> 
     <img src="images/nav-restaurant.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="102" height="33" border="0" /> 
    </td> 
    <td> 
     <img src="images/nav-tanzibar.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="92" height="33" border="0" /> 
    </td> 
    <td> 
     <img src="images/nav-events.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="82" height="33" border="0" /> 
    </td> 
    <td> 
     <img src="images/nav-packages.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="96" height="33" border="0" /> 
    </td> 
    <td> 
     <img src="images/nav-rewards.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="120" height="33" border="0" /> 
    </td> 
    </tr> 
</table>

만 예외가 될 것입니다. 테이블 셀에 여유 공간이 충분하지 않으면 플로팅이 문제가 될 수 있습니다.

출처

2013-09-04 12:24:17 John

내가 말했듯이 이미지가 자신의 테이블 셀에있는 경우 동일한 결과가 나옵니다. 전자 메일의 경우 플로트를 피할 수 있습니다. x) –

이미지 태그에 이것을 사용 해보십시오. 'style = "margin : 0; border : 0; 채우기 : 0; 표시 : 블록; " – John

HTML 전자 메일에서 이미지 사이에 공백을 추가하는 AOL

답변

관련 문제