2012-11-23 6 views
3

현재 이상한 (잘 html 전자 메일 ...) 세로보기에 문제가있어 견과류가됩니다.HTML 전자 메일 텍스트 세로 맞춤

기본적으로 내가 갖고있는 것은 테이블입니다 : 왼쪽에는 텍스트, 오른쪽에는 이미지입니다. 문제는 텍스트가 수직으로 정렬되어 있다는 것입니다. 나는 valign="middle", vertical-align:middle; 및 심지어 line-height:value;을 시도했지만 아무런 도움이되지 않습니다. 이미지가 TD의 상단에 basicly입니다 여기

코드입니다 (TD 높이 이미지처럼 같은 높이입니다) :

<table border="0" cellpadding="0" cellspacing="0" width="600" id="header"> 
<tr>  
<td border="0" cellpadding="0" cellspacing="0" width="600" align="left" valign="middle" style="text-transform: uppercase;font-family: tahoma,geneva,sans-serif;font-size: 14px;color: #898989;letter-spacing: 2px;"> 
<strong>Text field</strong> 
<img src="link_to_image.jpg" style="display:block;" align="right" valign="bottom" width="230" height="49" alt="Logo"> 
</td> 
</tr> 
</table> 

나도 같은 TD에서 이미지와 텍스트를 만들 필요가, 다른 이미지가있다 이 이미지가 다른 이미지 사이에 공백이 있습니다.

비슷한 문제가 발생 했습니까? 어떤 아이디어?

감사합니다, Baseckas

+0

td를 옵션이 아닌 두 개의 열로 나눕니다. – defau1t

답변

4

당신이, 당신은 두 개의 컬럼에 테이블 셀을 분할 한 열 텍스트가 있어야 브라우저에서 작동하지만 html로 - 이메일 것을 제공받을 수 있으며, 다른 colomn 이미지. 이것이 Outlook에서 올바르게 해석 할 수있는 유일한 방법입니다. div의 이미지 태그를 둘러 볼 수도 있지만 다시 Outlook의 결함이 있습니다.

+0

텍스트 용 div를 추가하면 더 많은 세로 공간 (필자가 필요로하지 않음)이 제공되고 패딩이나 여백이 도움이되지 않습니다. 이 깊은 작업장을 시작한 이유는 Outlook (이미지 사이의 공간 때문에) 때문입니다. 이 이미지는 이미지 벨로우즈의 일부이기 때문에이 별칭은 처방전이어야합니다. 테이블 셀을 두 개로 나누면 처음부터 피하려고하는 것을 망칠 것입니다. 어쨌든 당신의 대답에 감사드립니다. – Baseckas

+0

td를 두 열로 나누면 사물이 엉망이되어 코드에 다른 오류가있는 것입니다. td를 2 열로 나누는 것은 afaic으로가는 유일한 길입니다. – defau1t

+0

조언을 주셔서 감사합니다. 나는 그것을 조사 할 것이다. 적어도 이제는 일할 수있는 방법을 알게 될 것입니다. – Baseckas