mHelpMe mHelpMe - 9 days ago 5
C# Question

send outlook email with tables next to each other

So yesterday thanks to people on here I learnt how to put two table side by side. However it has now been decided that this information needs to be e-mailed.

So in my c# application I send the e-mail (Outlook) and set the HTMLBody property equal to the html code below.

However when I send the e-mail the second table is display below the first table, how do I get around this?

I've been reading that CSS might be useful however have no knowledge on CSS.

Side point

In my first table there is a row which just contains blank cells. Again reading that with CSS this wouldn't be needed but again I do not know how to include CSS in my HTML for my e-mail?

Example of HTML code

<b><font color='#0033CC'>Sales Report</font></b>
<br><br>
<b>Currency</b>
<br><br>
<table style='font-size: 10pt; float: left; display: inline-block;' cellpadding='3'>
<tr><td>&nbsp</td><th bgcolor= #0033CC>Q1</th><th bgcolor= #0033CC>Q2</th><th bgcolor= #0033CC>Q3</th><th bgcolor= #0033CC>Q4</th><th bgcolor = #0033CC>YoY</th></tr>
<tr><td>CAD</td><td style='text-align: center;'>5.9%</td><td style='text-align: center;'>4.4%</td><td style='text-align: center;'>3.4%</td><td style='text-align: center;'>4.3%</td><td style='text-align: center; background-color:#99FF99'><b><font color='#009933'>4.3%</font></b></td></tr>
<tr><td>CHF</td><td style='text-align: center;'>-1.1%</td><td style='text-align: center;'>-0.4%</td><td style='text-align: center;'>0.1%</td><td style='text-align: center;'>-0.4%</td><td style='text-align: center; background-color:#FF6666'><b><font color='#990000'>-0.4%</font></b></td></tr>
<tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr>
<tr><td>&nbsp</td><td style='text-align: center;'>0%</td><td style='text-align: center;'>0%</td><td style='text-align: center;'>0%</td><td style='text-align: center;'>0%</td><td style='text-align: center; background-color:#99FF99'><b><font color='#009933'>100%</font></b></td></tr>
</table>

<table style='font-size: 10pt; float: left; display: inline-block;' cellpadding='3'>
<tr><td><b>Region Agg</b><td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr>
<tr><td>&nbsp</td><td>EUR</td><td>GBP</td><td>USD</td><td>&nbsp</td></tr>
<tr><td>Region A</td><td>775</td><td>6,774</td><td><font color='#990000'>-16,786</font></td></tr>
<tr><td>Region B</td><td>0</td><td>0</td><td>6,459</td></tr>
<tr><td>Region C</td><td>0</td><td>4,328</td><td><font color='#990000'>-4,133</font></td></tr>
<tr><td>Region D</td><td>0</td><td>0</td><td>4,350</td></tr>
</table>

Answer

Can you try HTML attribute align="left" for the table also

<b><font color='#0033CC'>Sales Report</font></b>
<br><br>
<b>Currency</b>
<br><br>
<table style='font-size: 10pt; float: left; display: inline-block;' cellpadding='3' align="left">
<tr><td>&nbsp</td><th bgcolor= #0033CC>Q1</th><th bgcolor= #0033CC>Q2</th><th bgcolor= #0033CC>Q3</th><th bgcolor= #0033CC>Q4</th><th bgcolor = #0033CC>YoY</th></tr>
<tr><td>CAD</td><td style='text-align: center;'>5.9%</td><td style='text-align: center;'>4.4%</td><td style='text-align: center;'>3.4%</td><td style='text-align: center;'>4.3%</td><td style='text-align: center; background-color:#99FF99'><b><font color='#009933'>4.3%</font></b></td></tr>
<tr><td>CHF</td><td style='text-align: center;'>-1.1%</td><td style='text-align: center;'>-0.4%</td><td style='text-align: center;'>0.1%</td><td style='text-align: center;'>-0.4%</td><td style='text-align: center; background-color:#FF6666'><b><font color='#990000'>-0.4%</font></b></td></tr>
<tr><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr>
<tr><td>&nbsp</td><td style='text-align: center;'>0%</td><td style='text-align: center;'>0%</td><td style='text-align: center;'>0%</td><td style='text-align: center;'>0%</td><td style='text-align: center; background-color:#99FF99'><b><font color='#009933'>100%</font></b></td></tr>
</table>

<table style='font-size: 10pt; float: left; display: inline-block;' cellpadding='3' align="left">
<tr><td><b>Region Agg</b><td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td></tr>
<tr><td>&nbsp</td><td>EUR</td><td>GBP</td><td>USD</td><td>&nbsp</td></tr>
<tr><td>Region A</td><td>775</td><td>6,774</td><td><font color='#990000'>-16,786</font></td></tr>
<tr><td>Region B</td><td>0</td><td>0</td><td>6,459</td></tr>
<tr><td>Region C</td><td>0</td><td>4,328</td><td><font color='#990000'>-4,133</font></td></tr>
<tr><td>Region D</td><td>0</td><td>0</td><td>4,350</td></tr>
</table>