[Plugin: WP-Table Reloaded] Align Text Left and Reduce cell size

also, i managed to change one of the tables to without borders, but the background still is white after i changed it to f8f8f8, is anything wrong with my custom css area? you will notice the other table is still with alternate highlighted rows and the pagination refuses to show, why?

this is in my custom css area of wp-table reloaded:

.wp-table-reloaded-id-16, .wp-table-reloaded-id-16 td, .wp-table-reloaded-id-16 th {
border: none!important;
border-collapse: collapse!important;
border-spacing: 0px!important;

.wp-table-reloaded-id-1, .wp-table-reloaded-id-1 td, .wp-table-reloaded-id-1 th {
border: none!important;
border-collapse: collapse!important;
border-spacing: 0px!important;

.wp-table-reloaded-id-16 .row-26 td {
background-color: #F8F8F8!important;
}

.wp-table-reloaded-id-1 .row-29 td {
background-color: #F8F8F8!important;
}

.wp-table-reloaded td,
.wp-table-reloaded th {
text-align: left!important;
}

Hi,

yes, the centered text is the default in your theme.
To change this to left-aligned, just add the following code to the “Custom CSS” textarea on the “Plugin Options” screen of WP-Table Reloaded:

.wp-table-reloaded th,
.wp-table-reloaded td {
  text-align: left!important;
}

Regards,
Tobias

Hi,

the code is not working, because for the first two blocks, the closing } brackets are missing.
Once you add those (two occurances), the background color should be working.

Regards,
Tobias

the alignment works now! thanks!

however, why is the color not the same as the tab? it is still white instead of grey?

Hi,

that’s because you have only changed the background of one row (the last one), where it works as expected.

To change the background color of the entire table, you will need to use

.wp-table-reloaded-id-16 td {
  background-color: #F8F8F8!important;
}

Regards,
Tobias

thanks, it works great now for that table! how about the other one?

ah, i got it already! thanks a million!

whoops, something happened to the other table and pagination is gone. what can i do to enable it?

Hi,

you disabled the “Table Head” checkbox, which is required for the pagination feature (and all other features that the DataTables JavaScript library offers).

Regards,
Tobias

oh thanks, i shall enable it again then!

what do i do if i want to have a scrollbar for the table?

Hi,

unfortunately, I don’t have a solution for a scrollbar, sorry ?? I have seen it on a few sites, but I don’t really know how to add it to the JavaScript code, sorry.

Regards,
Tobias

no problem tobias. i am already enjoying your table as it is. someday if u do know how it will be perfect!

Hi,

yes, maybe I’ll find a solution in the future.
I’ll likely blog about that then on my website.
Have fun with the plugin!

Best wishes,
Tobias

Any chance in the future you would add per-column alignment options?

Also, the custom CSS in the plugin options means that all tables will be affected. Is there any way to restrict it to a specific table? Thanks.