HTML email text vertical align

Question

I am currently have an issue with strange (well, html emails...) vertical display and it drives me nuts.

Basicly what I have is table: text on the left and image on the right. The problem is that text is vertical aligned to top.I have tried valign="middle" , css vertical-align:middle; and even line-height:value; nothing helps. The image is basicly in the top of that TD (TD height is same height like image's)

Here is the code:

<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>

I need to make image and text in the same TD, else image has space between another image bellow this one.

Have anyone else encountered similar problem? Any ideas?

Regards, Baseckas

Answer 1

You can get it to work in a browser, but given that it is an html-email, you have to divide your table cell in to two columns and have one column the text and another colomn image. That is the only way Outlook will interpret it correctly. You may try surronding the image tag in a div, but that again has flaws for outlook.