Outlook Border not resolving - html

Question

I'm trying to make a HTML email template (difficult at the best of times) and I am trying to have a double line between the header and content. I'm trying to use border styles to achieve this like so:
<div class="1"> header image </div>
<div class="2"> random text </div>
using a head style sheet:
.1 {
margin:0;
padding: 0;
border-bottom:thin solid red;
}
.2 {
margin:0;
padding: 0;
border-top:thin solid yellow;
}
it seems to work fine in WLM and other email clients, but not outlook.

Answer 1

In my experience working with email HTML and Outlook, I find I always come back to using tables for layout. The many different email clients do many weird things to HTML, but table layouts seem to be the most cross-client compatible. So, consider something like this:
<table cellpadding="0" cellspacing="0" width="100%" style="border-bottom: solid 1px red;">
<tr>
<td> header image </td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" width="100%" style="border-top: solid 1px yellow;">
<tr>
<td> random text </td>
</tr>
</table>
I haven't tested this, but it's what I'd try first.

Answer 2

Oke to sart with, the easiest way to make a nice e-mail template is with tables ( not sure if you use them. Try to link as less as possible to your css but do style="" as much as possible.
And take a look at this one :OVER HERE! this one helped me out alot

Answer 3

I would suggest you use inline CSS for the border style and hex values for the color. I have changed your code to old school CSS. Tried and tested on Litmus
<table align="center" width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="ffffff">
<tr>
<td>
<table cellpadding="0" cellspacing="0" width="50%" style="border-bottom: solid 1px #ff0000;">
<tr>
<td> header image </td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="line-height: 20px; font-size: 20px;"> </td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" width="50%" style="border-top: solid 1px #ffff00;">
<tr>
<td> random text </td>
</tr>
</table>
</td>
</tr>
</table>