When you make a table "Scrollable" the column widths seem to switch to auto-width. I've tried to set the width in CSS using "Custom wpDataTables CSS", but that does not work for the width attribute as it should. This what I've tried:
FOr the table where "Scrollable" is checked, go to the column and set the "CSS class(es):" to "title_column".
In the "Settings -> Custom JS and CSS": Add this to "Custom wpDataTablesCSS" (I added "font-weight" just to see if it worked): table.wpDataTable td.title_column { font-weight: bold; width: 300px; }
The text in the column does show up as bold, but the width does not change.
Any idea how to set the width while still allowing horizontal scrolling?
Ahh. I see there are several others asking about this, and it's not possible. It would be great if you would consider adding the ability to set column widths for tables where horizontal scroll is enabled!
My work around was to add <br> tags within the content to make sure the columns with large amounts of text don't force the column to be REALLY wide. :)
Unfortunately Scrollable option is only functional when Limit table layout ( width) is turned off because this two options are overlapping. Scroll bar is something which browsers control but we will consider this option( because like you said that several users ask this) so we can implement it for future releases.
Sorry to disappoint you and thank you for understanding,
When you make a table "Scrollable" the column widths seem to switch to auto-width. I've tried to set the width in CSS using "Custom wpDataTables CSS", but that does not work for the width attribute as it should. This what I've tried:
FOr the table where "Scrollable" is checked, go to the column and set the "CSS class(es):" to "title_column".
In the "Settings -> Custom JS and CSS":
Add this to "Custom wpDataTablesCSS" (I added "font-weight" just to see if it worked):
table.wpDataTable td.title_column {
font-weight: bold;
width: 300px; }
The text in the column does show up as bold, but the width does not change.
Any idea how to set the width while still allowing horizontal scrolling?
Thanks!
Ahh. I see there are several others asking about this, and it's not possible. It would be great if you would consider adding the ability to set column widths for tables where horizontal scroll is enabled!
My work around was to add <br> tags within the content to make sure the columns with large amounts of text don't force the column to be REALLY wide. :)
~mike
Hi Mike,
Thank you for your purchase.
Unfortunately Scrollable option is only functional when Limit table layout ( width) is turned off because this two options are overlapping.
Scroll bar is something which browsers control but we will consider this option( because like you said that several users ask this) so we can implement it for future releases.
Sorry to disappoint you and thank you for understanding,
Best regards.
Kind Regards,
Miloš Jovanović
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables