TablePress is a fantastic free WordPress plugin which allows anyone to build tables for price comparisons or anything else for their website. The one problem however is that the columns do not come centred as default, so when you view the table the text will be left aligned.

Some bloggers will want the text in each column to be centred to make it look neater. There is a way to do this within the CSS settings of the plugin. Lots of us don’t like the idea of messing around with lots of CSS but the process is very easy and applies only to your tables and nothing else on the website so there is no need to worry about messing anything up.

You can use the CSS settings to centre either individual columns in a table or all columns. Let’s look at how to do each of these things in turn.

Centering Text in a Specific Column in a Specific Table Only

Here’s how to align specific columns of content in your table only:

• Go to the Plugin Options tab on the main menu of the TablePress plugin on your Dashboard.
• At the top of this page is a Frontend Options box with Custom CSS in it. This is where you need to put the code in. Make sure the “Load these Custom CSS commands to influence table styling” box is ticked.
• You then need to put specific kind of code into this box, as follows:

.tablepress-id-x .column-x {
text-align: center;
}

where x is the number of the table and the column you want to center. All tables you create get assigned a number or ID, which is in the shortcode. This is what you put in to identify which table needs this styling, along with the columns number you want to centre.

For example, to center the first column of your first table, you would enter 1 and 1 where the x’s are; to center the second column of your first table you would enter 1 and 2 and so on. This way you can apply the centering to just the tables and columns you want.

Once you have put the first one in, you can just copy and paste down and change the numbers to make it easier. Be sure to put a space between each block of code to keep it all neat.

Centering Text in All Columns in all Tables

If you want column centering to be the default setting for all columns in all tables, then you use a very similar code, just leaving out the specific table ID so the plugin will apply the code to all tables created.

Take exactly the same steps as above, but paste this code in instead:

.tablepress .column-x {
text-align: center;
}

Where x is the column number you want to center in all tables created

Paste this code into the box for all the columns numbers you plan to have in an all tables on your website. For example if you put 1 in where the x is, it will center the first column in every table created; if you put 2 in it will center the second column in all tables and so on. Do this for as many columns as you anticipate needing in your tables.

For example, it might be good idea to paste them in going up to column 5. This will cover you in advance for all tables up to five columns wide. If you go past 5 columns on some tables you can also add more into the code later.

Centering an Entire Table on a Page

To center an entire table on a page on your site, go to the same box on the Plugin Options page and paste this code in:

.tablepress-id-x {
width: auto;
margin: 0 auto 1em;
}

where x is the ID number of the table you want to center. This will center just this table you define. To center all TablePress tables on the site, then take out the ID part so it just looks like this:

.tablepress {
width: auto;
margin: 0 auto 1em;
}

Save settings and exit. You have now styled the text and tables on your site as you want!

Click here to get the free TablePress plugin for WordPress.