Hi Nicolas,
thanks for your post, and sorry for the trouble.
Can you please post the link to the page where this happens, so that I can investigate this more closely?
Thanks!
Tobias
Hi Tobias,
here is the page (the 8th column should be larger) :
http://www.courir-plus-loin.com/column-width-bug/
Thanks !
Nicolas
Hi,
thanks for the link.
First, this is not really an issue with the column widths, but more with some general CSS. Also, we should optimize your CSS a little bit, at first. So, please replace all of your “Custom CSS” with this:
.tablepress thead th,
.tablepress tfoot th {
background-color: #4BB5C1;
}
.tablepress-id-1 {
table-layout: fixed;
}
.tablepress-id-1 th,
.tablepress-id-1 td {
padding: 3px;
vertical-align: middle;
}
.tablepress-id-1 .column-8 {
width: 250px;
}
That should fix the problem with the head row widths, and it should allow the column width to be changed.
Regards,
Tobias
Unfortunately it doesn’t work, it seems the option “table-layout: fixed” creates another bug.
Hi,
woah, yes, that looks ugly. Please remove the block with the table-layout from the Custom CSS then.
Unfortunately, I don’t really know how to fix this then 🙁
I had a similar problem a few weeks ago, and I think we solved it be changing themes, as the theme was creating this issue there.
Can you check if the problem with the column widths in the head row is also there in a WordPress Default theme?
Regards,
Tobias
I checked using the theme previsualization tool in wordpress but it doesn’t work.
Regards,
Nicolas
Hi,
ok, thanks for checking!
My only remaining suggestion is that you ask for help in the forums of the DataTables JavaScript library, at http://www.datatables.net, as the Horizontal Scrolling is a feature of that. Maybe Allan Jardine, the DataTables developer, can find out what’s causing this…
Sorry for not being able to help better 🙁
Regards,
Tobias
Hi,
I finally managed to fix the bug about the width of a column, by integrating directly DataTable in my page.
Nicolas
Hi Nicolas,
thanks for the update. Great to hear that is working now!
And I see that you also added some extra features in the head row, very nice!
Best wishes,
Tobias
Hi,
I had a similar problem and was not able to find the solution.
I tried to first fix the table width and then the column and it worked.
I hope it can help someone there…
.tablepress {table-layout: fixed;width: 800px;}
.tablepress-id-1 .column-1 {width: 400px;}
.tablepress-id-1 .column-2 {width: 400px;}
Cheers
or even better:
.tablepress {table-layout: fixed;width: 100%;}
.tablepress-id-1 .column-1 {width: 50%;}
.tablepress-id-1 .column-2 {width: 50%;}
Hi,
good idea! Thanks for sharing this code! This might indeed be helpful to some people!
Best wishes,
Tobias
YES!! I have been reading ALL of the column width issue posts and Damien31’s suggestion was the one that worked. Thank you! Can I recommend adding that first line of code that includes “fixed” into the FAQ of tablepress?
Hi,
great to hear that this helped! 🙂
And yes, this should probably be added to the plugin FAQ. I’ll take that as my New Year’s resolution 🙂
Best wishes,
Tobias
P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!
