Method 1:

Create and copy a table in Microsoft Word or in NeoOffice (Mac OS X) or OpenOffice/LibreOffice Writer or copy a table from any HTML page and directly paste it in the “Visual Editor”. That’s it. You can see the automatically created code complete with tags when switching to “Text Editor”.

But, somehow, tables created using Pages (Mac OS X) are not working. Bizarrely though, tables created in Pages copied and pasted to Word or Writer then copied and pasted in “Visual Editor” works perfectly well. Strange!!!

Note: Better don’t use “Paste from Word” which will be visible after enabling “Show/Hide Kitchen Sink (Alt + Shift + Z)” from “Visual Editor”.

Method 2:

If you don’t have Pages or Word or Writer handy, then use the following simple HTML code in “Text Editor” mode for the following table.

Row 1, Coulmn 1 Row 1, Coulmn 2 Row 1, Coulmn 3
Row 2, Coulmn 1 Row 2, Coulmn 2 Row 2, Coulmn 3

Code:

<table style=”margin: auto;” border=”1″>
<tbody>
<tr>
<td>Row 1, Coulmn 1</td>
<td>Row 1, Coulmn 2</td>
<td>Row 1, Coulmn 3</td>
</tr>
<tr>
<td>Row 2, Coulmn 1</td>
<td>Row 2, Coulmn 2</td>
<td>Row 2, Coulmn 3</td>
</tr>
</tbody>
</table>

A bit more sophisticated table.

Code:

<style type=”text/css”><!–
P { margin-bottom: 0.08in; }
–></style>
<table width=”583″ border=”1″ cellspacing=”0″ cellpadding=”7″><colgroup> <col width=”184″ /> <col width=”178″ /> <col width=”177″ /> </colgroup>
<tbody>
<tr valign=”TOP”>
<td bgcolor=”#b0b3b2″ width=”184″></td>
<td bgcolor=”#b0b3b2″ width=”178″>
<p align=”CENTER”><span style=”color: #000000;”><span style=”font-family: Helvetica,sans-serif;”><span style=”font-size: medium;”><b>Column 1</b></span></span></span></p>
</td>
<td bgcolor=”#b0b3b2″ width=”177″>
<p align=”CENTER”><span style=”color: #000000;”><span style=”font-family: Helvetica,sans-serif;”><span style=”font-size: medium;”><b>Column 2</b></span></span></span></p>
</td>
</tr>
<tr valign=”TOP”>
<td width=”184″><span style=”color: #000000;”><span style=”font-family: Helvetica,sans-serif;”><span style=”font-size: medium;”>Row 1</span></span></span></td>
<td width=”178″></td>
<td width=”177″></td>
</tr>
<tr valign=”TOP”>
<td width=”184″><span style=”color: #000000;”><span style=”font-family: Helvetica,sans-serif;”><span style=”font-size: medium;”>Row 2</span></span></span></td>
<td width=”178″></td>
<td width=”177″></td>
</tr>
<tr valign=”TOP”>
<td width=”184″><span style=”color: #000000;”><span style=”font-family: Helvetica,sans-serif;”><span style=”font-size: medium;”>Row 3</span></span></span></td>
<td width=”178″></td>
<td width=”177″></td>
</tr>
</tbody>
</table>

To align center:

Use style=”margin: auto;” as other methods like “align center” are deprecated. Usage example:

Code:

<table style=”margin: auto;” width=”206″ border=”0″ cellspacing=”1″ cellpadding=”1″>

Note: The methods discussed in this blog may give a different result or may not work in old and unsupported browsers. And again, the underlying “Theme” of your WordPress blog will also mess up the tables. Both the tables given in this example looked good in “Visual Editor“. But when once published, in the original post, they are completely different or messed up.

Thanks for the read and please leave comments🙂