Perché tutte quelle tabelle annidate? Perché metti un text-align:center sulle celle e nella dichiarazione successiva un text-align:left, e poi torni a centrare nel div? Inutile lo span in cui imposti lo stesso carattere. Per distanziare il testo puoi usare padding o margini sul div e impostare su quello lo sfondo. Esempio:

codice:
...
<style type="text/css">
<!--
#miaTabella {
	border: none;
	border-collapse:collapse;
	width:568px;
}
#miaTabella td {
	padding:0;
	width:186px;
}
#miaTabella td div{
	padding:2px 10px;
	margin:0 10px;
	font-family:Verdana,Geneva,sans-serif;
	font-size:12px;
	color:#446687;
	background: #ecf0f3;
	text-align:center;
	text-transform:uppercase;
}
-->
</style>
</head>

<body>
<table id="miaTabella">
 <tr>
 <td><div>prova prova prova</div></td>
 <td><div>prova prova prova</div></td>
 <td><div>prova prova prova</div></td>
 </tr>
 <tr>
 <td><div>prova prova prova</div> </td>
 <td><div>prova prova prova</div></td>
 <td><div>prova prova prova</div></td>
 </tr>
 </table>
</body>
</html>
Poi probabilmente potresti anche fare a meno delle tabelle