I have created a table in html for an email (FYI this is not for spam, it's to be used internally at the organization I work for). CSS is pretty much out of the question since we use Outlook and Office 2007 (which will not render the CSS properly - nothing worked on that front). I have 2 cells side by side - one has a background image with text over top, the other has a ttile using an h1 tag I created.
The issue: when I input a 2-lined title in the cell adjacent to the one with the background pic, the spacing at the botttom is so large the background picture duplicates part of it vertically (even though the text in the adjacent cell is not larger than the pic). I have tried to specify the padding, but it doesn't change anything.
My rule for the h1 tag looks like this:
td.leftCol h1 {
color: #003152;
font-size: 0.9em;
}
The code for the cells in question is this:
<tr bgcolor="#FFFFFF">
<td width="150px" height="42px" class="leftCol" background="/news/newsletters/images/leftcol_box.gif" align="right"><font color="#FFFFFF"><strong>Text </strong></font></td>
<td width="298px" class="leftCol" style="padding: 5px 0px 0px 0px;"><h1>New Medical School in New Brunswick</h1></td>
</tr>
Any suggestions?