Looks like I found the answer ..
The “align” attribute has been deprecated, however, in favor of CSS (Cascading Style Sheets), and this is a good thing. However, it’s not so obvious how to center a table using CSS.
The obvious way might appear to use the CSS “text-align: center;” somewhere, maybe like one of these:
<table style=”text-align:center;”>
OR
<div style=”text-align:center;”>
<table>
…
</table>
</div>
OR, if you get really desperate,
<body style=”text-align:center;”>
<table>
…
</table>
</body>
None of these will work. The table itself will be left-aligned, but all the content in the table cells will be centered.
Why? Because “text-align” applies to inline content, not to a block-level element like “table”.
Method 1
To center a table, you need to set the margins using a CSS class like this:
table.center {margin-left:auto; margin-right:auto;}
And then do this:
<table class=”center”>
…
</table>
At this point, Mozilla and Opera will center your table. Internet Explorer 5.5 and up, however, needs you to add this to your CSS as well:
body {text-align:center;}
The above is an extract from the following article http://www.granneman.com/webdev/coding/css/centertables/
I updated the template.css to add the table class – and this now works – see further example of table using class=”center”
http://btbanews.org.uk/index.php?option=com_content&view=article&id=136:2010-yac-squad&catid=31:general&Itemid=46