Monday, June 3, 2024
 Popular · Latest · Hot · Upcoming
104
rated 0 times [  108] [ 4]  / answers: 1 / hits: 8160  / 11 Years ago, mon, february 10, 2014, 12:00:00

I have problem with my datatable: it has to have a specific width, but also I want to display all its columns. The whole issue looks like this:



overflow



I found solutions Datatables Width Overflow For A Lot Of Columns and JQuery Datatables overflow, but I would rather use word breaking then have a scrollbar in my table.



So, I found another solution jQuery DataTable overflow and text-wrapping issues according to which i had to set:



  table.display { table-layout:fixed; }
th, td { word-wrap:break-word; overflow:hidden; text-overflow: ellipsis; }


However, with this I had a problem with column width; all columns have same width and option bAutoWidth: true is ignored:
enter



For example, there is an empty horizontal space in Price column, or after icons at last column. Moreover word-broken headers (th) seem very ugly, and it would look better if Code, Count, Price and Place columns were at their minimum size (their width matched width of header text).



I would like to specify (somehow) preferred width for each column, or after how many letters it should wrap. I found breakCellText plugin in this post jQuery DataTable overflow and text-wrapping issues. Nevertheless, this plugin is not working with my datatables 1.9.4.


More From » jquery

 Answers
2

I had the same problem. Here is my solution:



.dt-index {
column-width: auto !important;
}


Please use this style for your table.



I hope that will be your solution.



Greetz
Vegeta_77


[#47860] Monday, February 10, 2014, 11 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
lesli

Total Points: 348
Total Questions: 105
Total Answers: 119

Location: United States Minor Outlying Island
Member since Fri, Jan 6, 2023
1 Year ago
;