How to Center Content in wpDataTables

Apply custom CSS to center table cells, headers, or specific columns in your tables.

You can center cell data, headers, or individual columns using custom CSS. Here’s how:


🛠 1. Center all content in a specific table (cells + headers)

Go to the table’s settings and add the following CSS under:
Customize → Custom CSS

.wpDataTablesWrapper table.wpDataTable td.numdata,
.wpDataTablesWrapper table.wpDataTable th.numdata {
  text-align: center !important;
}

.wpDataTablesWrapper table.wpDataTable > thead > tr > th {
  text-align: center !important;
}

.wpDataTablesWrapper table.wpDataTable td {
  text-align: center !important;
}

2. Apply center alignment globally to all tables

To apply the same styling across all tables, paste the CSS under:
Main Plugin Settings → Custom JS and CSS → Custom CSS


3. Center only specific columns

  • Go to the Column Settings → Display

  • Assign a custom class (e.g., center) to the desired column(s)

Then add the following CSS in the table’s Customize → Custom CSS section:

td.center {
  text-align: center !important;
}
th.center {
  text-align: center !important;
}

You can change the class name from center to anything you like — just match it in both the column settings and the CSS.


🔧 Need to add CSS directly to the page?

If you prefer to add the CSS outside of wpDataTables, here’s a guide that explains how to do it based on your page builder:
https://www.wpbeginner.com/plugins/how-to-easily-add-custom-css-to-your-wordpress-site/


🔍 Explore more styling options

Did this answer your question?
😞
😐
😁