Anandkumar Mehta Anandkumar Mehta - 1 month ago 11
CSS Question

Not getting proper output in outlook of basic html code with table tags

I am trying to make a template, which I want to use with outlook, but when I use this code, i am getting logo at right and link text left in outlook, which is total oppose to which output I want. How do I resolve it?

<center>
<table width="600px;" style="margin:auto auto;">
<tr style="left:auto">
<td>


In this main table's td tag below mentioned tables are included.. I also check that all tags are closed properly without forget any single tag.

This code is for logo and link's main table...

<table width="150px;" bgcolor="ffffff" cellpadding="0" cellspacing="0" align="left">


this code for link

<td style="text-align:right;">
<a href="http://www.url.com" target="_blank">
<span style="font-family:Myriad Pro; color:#0d5497; font-size:20px; text-align:end; inline-box-align:last; left:auto" data->www.linkurl.com
</span>
</td>


I had also used text-align, left:auto, right:auto in

<table> <tr> <td>


level accordingly but not getting proper output.

Image of output in outlook

Image of output in outlook

Answer

I think this is more towards what you are looking for here: JSFiddle Example

You had the right idea with

<td style="text-align:right;">
<a href="http://www.url.com" target="_blank">
<span style="font-family:Myriad Pro; color:#0d5497; font-size:20px; text-align:end; inline-box-align:last; left:auto" data->www.linkurl.com
</span>
</td>

but some of your css looks a little off. Text-align doesn't have an 'end' value and I had never heard of inline-box-align before.

Comments