Buttons on welcome e-mail not in one line

Hi,

I have taken over www.perfectpartybits.co.uk. On the welcome e-mail, we have a few buttons that link back to the site, see picture. I need this displayed in one line, not underneath each other.

In E-mail, I have email_template_welcome.html with the following:

.nav{
width:900px;
float:left;
height:27px;
padding:5px 0px 7px 0px;
margin: 0px;
}
.nav li{
list-style-type: none;
float:left;
padding-right: 2px;
}
.nav li a img {border:none;}

In Includes -> Languages -> English -> My Template I have create_account.php with this:

<ul class="nav" style="width:900px; float:left; height:27px; padding:5px 0px 7px 0px; margin: 0px;">
<li style="list-style-type: none; float:left; padding-right: 2px;"><a href="'.zen_href_link(FILENAME_DEFAULT,'cPath=6').'" title="Kids Party"><img style="border:none;" src="images/green_btn.gif" /></a></li>
<li style="list-style-type: none; float:left; padding-right: 2px;"><a href="'.zen_href_link(FILENAME_DEFAULT,'cPath=9').'" title="First bithdays"><img style="border:none;" src="images/orenge_btn.gif" /></a></li>
<li style="list-style-type: none; float:left; padding-right: 2px;"><a href="'.zen_href_link(FILENAME_DEFAULT,'cPath=10').'" title="Special Occasion"><img style="border:none;" src="images/green_btn3.gif" /></a></li>
<li style="list-style-type: none; float:left; padding-right: 2px;"><a href="'.zen_href_link(FILENAME_EZPAGES,'id=6').'" title="Party Blog"><img style="border:none;" src="images/pink_btn1.gif" /></a></li>
<li style="list-style-type: none; float:left; padding-right: 2px;"><a href="'.zen_href_link(FILENAME_EZPAGES,'id=1').'" title="About Us"><img style="border:none;" src="images/brown_btn.gif" /></a></li>
</ul> <br />

Can someone please help as I have tried a few things on the internet but nothing works? I am not very good with code but a push in the right direction will be greatly appreciated.