The code below works to center a table within a div in IE but not FF. The text below the table centers just fine, but the table remains left justified. Could somebody please tell me what I have wrong here because I've tried some modifications to the CSS without any luck.

<style type='text/css' media='all'>
div.mysite1{font-size: 14px;text-align:center}
td.mysite-primary{background-color: rgb(12,28,100);color:rgb(255,255,255);font-size: 14px;}

td.mysite-secondary-right{align:right;background-color: rgb(215,14,238);color:rgb(45,0,0);font-size:14px;text-align:right;}

td.mysite-secondary-left{align:right;background-color: rgb(215,14,238);color:rgb(45,0,0);font-size:14px;text-align:right;}

center.table{margin-left:auto; margin-right:auto; text-align:left;}
</style>
<div class='mysite1'>
<table class='center'>
<tr>
<td class = 'mysite-primary'><b>Value1</b></td>
<td class = 'mysite-secondary-left'>0</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value2</b></td>
<td class = 'mysite-secondary-right'>1</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value3</b></td>
<td class = 'mysite-secondary-left'>0</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value4</b></td>
<td class = 'mysite-secondary-left'>7.1</td>
</tr>
<tr>
<td class = 'mysite-primary'<b>Value5</b></td>
<td class = 'mysite-secondary-left'>13.1</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value6</b></td>
<td class = 'mysite-secondary-left'>9.5</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value7</b></td>
<td class = 'mysite-secondary-left'>22.6</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value8</b></td>
<td class = 'mysite-secondary-left'>2.2</td>
</tr>
<tr>
<td class = 'mysite-primary'><b>Value9</b></td>
<td class = 'mysite-secondary-left'>0.6</td>
</tr>
</table>
More at <a href='http://mysite.com/'>mysite.com</a>.</div>