HTML 이메일 - img 태그에 Outlook 2007의 국경은 2013 년</p> <p>,

Question

내가 HTML 이메일 일하고

누락 및 Outlook 2007, 2010 년에 일부 CSS 스타일 문제가되어 나는 두 TD를 셀의 이미지와의 1이 그 (것)들은 그 (것)들을 분리하기 위하여 수직 국경 분배기를 원한다. 내가 실행 한

<tr> 
    <td bgcolor="#673695" style="color:#ffffff;padding:14px 0 14px 14px;text-align:left;border-collapse: collapse;"> 
     <img src="lowreslogo.png" border="0" width="130" style="border-right:1px solid #a377cd;padding-right:20px;" align="left"> 
     <img src="email_logo.png" border="0" width="150" align="left" style="padding-top:7px;"> 
    </td> 
</tr> 

: 내가 처음 (왼쪽 이미지)에 테두리를 오른쪽에 배치하고 모든 클라이언트에서 작동/아웃룩 2007, 2010에 의해 브라우저 여기

2013 년 내가 사용하고있는 코드는 litmus.com을 통해이 클라이언트의 몇 가지 도움이 필요합니다. 표준 프로젝트의 Outlook 2007에 대한보다가 이메일에서 the report를 참조 - 나는

Answer 1

Outlook 2007에서는 <img> 요소에 CSS border을 지원하지 않습니다 ... 단지 보조 노트와 같은 내장 테두리를 가지고 두 이미지를 수정하지 못할 같은 사이트 here의 상세한 예입니다. 그것은 그 <img> 요소 does supportborder-right를 상태로

그래서 Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 문서가 잘못된 것 같습니다.

대신 <span>에 첫 번째 이미지를 배치하고 그 대신에 스타일을 지정하는 것이 좋습니다. 미안 해요 Outlook이 없기 때문에 테스트 할 수 없습니다.

Answer 2

동일한 이미지에서 html로 border = 0을 선언하고 있습니다. 이 경우 귀하의 CSS 선언을 재정의하는지 확실하지 않습니다.

1로 설정해보십시오 (또는 모두 제거 할 수 있습니다). 이 값을 1로 설정하면 3 개의 다른 경계선의 색상을 배경과 일치하도록 설정해야 효과적으로 보이지 않게됩니다.

Answer 3

다음과 같은 두 개의 이미지를 래핑 할 수 있다고 생각합니다. 몇 가지 추가 코드가 있지만 렌더링 문제를 해결합니다.

<tr> 
    <td bgcolor="#673695" style="color:#ffffff;padding:14px 0 14px 14px;text-align:left;border-collapse: collapse;"> 
     <table border="0" cellpadding="0" cellspacing="0" width="300" style="color:#ffffff"> 
      <tr> 
       <td width="130"><img src="lowreslogo.png" border="0" width="130" alt="" style="display: block;" /></td> 
       <td width="19"></td> 
       <td width="1" bgcolor="#a377cd"><td> 
       <td width="150" style="padding-top:7px;"><img src="email_logo.png" border="0" width="150" alt="" style="display: block;" /></td> 
      </tr> 
     </table> 
    </td> 
</tr>