Not in same position in Mozila ans IE

I have this menu on my site and I jut can’t get it to line up the same in the two browsers. Mozilla displays it the way that I want nd IE has it all messed up.Not in same position in Mozila ans IE. You can see the two images here: [url]http://west4me.com/IE.jpg[/url] and [url]http://west4me.com/moodle2.jpg[/url]. The second image is the way that I want it to look. The website is [url]http://www.west4me.com/moodle[/url]

This is is the code for that section:

[CODE]<table width=”100%” height=”174px” border=”0″ cellpadding=”0″ cellspacing=”0″ background=”http://www.west4me.com/webcollab/head.jpg”>
<ul id=”topnav”>
<li><a href=”http://west4me.com/moodle” id=”navHome” title=”Posted Recently” accesskey=”h”>Home</a></li>
<li><a href=”http://west4me.com/cal” id=”navHome” title=”Posted Recently” accesskey=”c”>Calendar</a></li>
<li><a href=”http://west4me.com/story2″ id=”navHome” title=”Posted Recently” accesskey=”s”>Stories</a></li>
<li><a href=”http://west4me.com/bookmarks” id=”navHome” title=”Posted Recently” accesskey=”b”>Bookmarks</a></li>
<li><a href=”http://west4me.com/wordpress” id=”navHome” title=”Posted Recently” accesskey=”w”>Blog</a></li>
<li><a href=”http://west4me.com/webcollab/index.php” id=”navHome” title=”Posted Recently” accesskey=”p”>Writing Progress</a></li>
<li><a href=”http://west4me.com/kidscms/index.php” id=”navHome” title=”Posted Recently” accesskey=”f”>Student Pages</a></li>
<li><a href=”http://west4me.com/daily/name.php” id=”navHome” title=”Posted Recently” accesskey=”f”>Name Draw</a></li>
<li><a href=”http://www.west4me.com/daily/job2.php” id=”navHome” title=”Posted Recently” accesskey=”g”>Jobs</a></li>
</ul>

<tr>

<td align=”right” class=logininfo><?php echo $menu ?></td>

</tr>
</table>[/CODE]

This is the CSS for that section.

[CODE] #topnav
{
list-style:none;
float: right;
font-size:1.0em;
margin:0 auto;
padding:5px 20px 0 0;
text-align: right;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#topnav li
{
list-style:none;
display:inline;
padding:0;
margin:0;
font-weight:bold;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#topnav li a:link, #topnav li a:visited
{
text-decoration:none;
color:#BBC4A3;
}
#topnav li a:hover, #topnav li a:active
{
color:#F7F3ED;
}[/CODE]

Any ideas why it is doing that?

Also in #CSS _↴