Firefox ignoring my table CSS

[mccollin]

I have a CSS problem that I'm baffled with. I've stripped nearly everything functional out of this test page to get it down to the bare essentials. The CSS for the table is as such...

PHP Code:


table.spectab { 
    width:100%; 
    border-collapse:collapse; 
    border-style:none; }
table.spectab tr td,th { 
    margin:0; padding:5px 7px 5px 0; 
    border-bottom:1px solid #bfbfbf; }
table.spectab tr th { 
    font-weight:bold; }
table.spectab tr.noline td { 
    border-bottom:none; } 


The html is as follows...

PHP Code:

<table class="spectab" border="0"  width="100%"    cellpadding="10" cellspacing="2"> 

<tr> 
    <td width="40%">test</td> 
    <td width="60%">a</td> 
</tr> 
<tr valign="top"> 
    <td  width="40%">test</td> 
    <td  width="60%">b</td> 
</tr> 
<tr valign="top"> 
    <td  width="40%">test</td> 
    <td  width="60%">c</td> 
</tr> 

</table> 


The resulting page is at http://pdaphonehome.com/?page=tabletest

In IE7 the table looks as it should... in FF the table loses its formatting. Anyone know what's wrong here?