CSS in IE vs FireFox issue.

Ok.. Now I'm having an issue with the CSS with IE. Firefox works fine.
http://www.geeklab.net/images/ie-css-firefox.jpg

Notice how the FireFox screen shot has a border around the table and IE doesn't? Well I want IE to show it up like FireFox.

Here's the code that I'm using (css and html):
CSS:

a.mainlevel:link, a.mainlevel:visited {
/*background: url(menu_bg.png) no-repeat;*/
/*background:#eaeaea;*/
vertical-align: left;
font-size: 10px;
font-weight: bold;
color: #888888;
text-align: left;
/*padding-top: 0px;*/
padding-left: 1px;
/*height: 20px !important;*/
/*height: 25px;*/
width: 100%;
text-decoration: none;
}

table.moduletable {
width: 100%;
margin-bottom: 5px;
padding: 1px;
border-spacing: 0px;
border-collapse: separate;
cellspace: 1px;
background: black;
}

table.moduletable th {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
/*background: url(../images/subhead_bg.png) repeat-x;*/
background: #7F5D00;
color: #FFBA00;
text-align: right;
padding-top: 4px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;

}

table.moduletable td {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
padding: 0px;
margin: 0px;
font-weight: normal;
background:#eaeaea;
}


Table layout:

<table cellpadding="0" cellspacing="0" class="moduletable">
<tr>
<th valign="top">
Main Menu
</th>
</tr>
<tr>
<td>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="left"><td><a href="index.php?option=com_frontpage&amp;Itemid=1" class="mainlevel" id="active_menu">Home</a></td></tr>
<tr align="left"><td><a href="index.php?option=com_content&amp;task=section&amp;id=1&amp;Itemid=2" class="mainlevel" >News</a></td></tr>
<tr align="left"><td><a href="index.php?option=com_content&amp;task=blogsection&amp;id=0&amp;Itemid=9" class="mainlevel" >Blog</a></td></tr>
<tr align="left"><td><a href="index.php?option=com_weblinks&amp;Itemid=23" class="mainlevel" >Links</a></td></tr>
<tr align="left"><td><a href="index.php?option=com_contact&amp;Itemid=3" class="mainlevel" >Contact Us</a></td></tr>
<tr align="left"><td><a href="index.php?option=com_search&amp;Itemid=5" class="mainlevel" >Search</a></td></tr>
<tr align="left"><td><a href="index.php?option=com_content&amp;task=category&amp;sectionid=3&amp;id=7&amp;Itemid=25" class="mainlevel" >FAQ's</a></td></tr>
</table>
</td>
</tr>
</table>

So what's my problem?

Its the way IE renders padding, that black border you saw in FF, was just the background color of the table showing through, I say just make a border in CSS, use this for your CSS, I have taken out the items you had commented, and items that didnt make a difference if they were there or now. You had vertical-align:left. Thats not even valid how would it be? Vertical is up and down, left is well sideways.
a.mainlevel:link, a.mainlevel:visited {
font-size: 10px;
font-weight: bold;
color: #888888;
padding: 1px;
text-decoration: none;
}

table.moduletable {
width: 100%;
margin-bottom: 5px;
border:1px solid #000000;
background: #000000;
}

table.moduletable th {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
background: #7F5D00;
color: #FFBA00;
text-align: right;
padding-top: 4px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;
}

table.moduletable td {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: normal;
background:#eaeaea;
}

figured it out..
here's the new css
table.moduletable {
width: 100%;
margin-bottom: 5px;
padding: 0px;
border-spacing: 0px;
border-collapse: separate;
border: 1px solid black;
cellspace: 1px;
background: black;
}

Its the way IE renders padding, that black border you saw in FF, was just the background color of the table showing through, I say just make a border in CSS, use this for your CSS, I have taken out the items you had commented, and items that didnt make a difference if they were there or now. You had vertical-align:left. Thats not even valid how would it be? Vertical is up and down, left is well sideways.
a.mainlevel:link, a.mainlevel:visited {
font-size: 10px;
font-weight: bold;
color: #888888;
padding: 1px;
text-decoration: none;
}

table.moduletable {
width: 100%;
margin-bottom: 5px;
border:1px solid #000000;
background: #000000;
}

table.moduletable th {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
background: #7F5D00;
color: #FFBA00;
text-align: right;
padding-top: 4px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;
}

table.moduletable td {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: normal;
background:#eaeaea;
}

Thanks that helps too!
Now to figure out the issue with Mambo and how to change how the front side looks with posts on the front page..

http://ellisgl.mine.nu/mambo/
I'm trying to convert an old theme over. So the new stuff is on top of the old stuff for reference.

fyi, cellspace isn't valid css, to get cellspace you can use border-spacing, which isn't supported by MSIE, and border-collapse which is supported by MSIE.
You can check the specs.
http://www.w3.org/TR/CSS2/

I used your code since it looked a lot smaller and well it works .. =P
thanks a ton man!