Same width

Hi,

thanks for your post. Good to hear that you like the plugin!

The width of the columns are determined by the browser automatically, based on the number of columns in the table, and on the contents in the table.

To make them all same width, you’ll need some CSS code. And you actually know that CSS code already, as you are already using it.
Unfortuantely though, there’s no way to do this with a single piece of code for all tables, because the number of columns decided what the exact percentage values need to be.
So, at first, delete this “Custom CSS”:

.tablepress .column-1,
.tablepress .column-2 {
	width: 50% !important;
}

.tablepress .column-3,
.tablepress .column-4 {
	width: 50% !important;
}

This will not work, as it would in total set a column width of 200% to a table with four columns.

Instead, you will need to use something like this (which you are already using):

.tablepress-id-51 .column-1,
.tablepress-id-51 .column-2,
.tablepress-id-51 .column-3,
.tablepress-id-51 .column-4 {
	width: 25% !important;
}

Now, this can hwoever be optimized a little bit. Instead of duplicating the CSS selector, you can shorten this to

.tablepress-id-51 th
.tablepress-id-51 td {
	width: 25% !important;
}

So, for every table with four columns, you would just that. For a column with five columns, you would instead use this (because 100% divided by 5 is 20%):

.tablepress-id-123 th
.tablepress-id-123 td {
	width: 20% !important;
}

Regards,
Tobias

Hi,

the widths in your table are not the same because the content in the column has different widths, and because of the CSS code from above that I asked you to delete. That influences the browser so that the columns get different widths. To have the columns have the same width, just follow my code suggestion from above for all of your tables.

Regards,
Tobias

Hi,

for copying that table from the first link: No sorry, I don’t have a solution to that. The problem with that is that this is not really a table (in the code). It is just text that looks like a table.

About the problem with the pagination: The problem here is a JavaScript error in another JS file on the site, from your theme, as it seems. That breaks, and due to that, the browser stops executing all JavaScript.
The error is Uncaught TypeError: Cannot read property 'offsetParent' of undefined in line 35 of the file http://grid.f1arab.com/wp_ar/wp-content/themes/f1arabv2013/js/stepcarousel.js
Once you fix that, or remove that, the JS will work.

Regards,
Tobias

Hi,

I’m really sorry, but I’m also not that much of an expert in JS and don’t really see why this happens. As this is a problem in your theme, you should probably contact the developer of your theme. And actually, I just spotted another problem:
The theme makes WordPress load a very old version of the jQuery JavaScript library from the Google CDN, instead of simply using the up-to-date version that ships with WordPress. This is also bound to cause trouble with other plugins (including TablePress).
You’ll therefore really need to get your theme updated…

Regards,
Tobias