jQuery DataTables fixed size for ONE of the columns?

后端 未结 1 891
日久生厌
日久生厌 2020-12-21 23:28

I have a DataTables table where I want it to autosize as default (when resizing window and according to initial content etc.), except for one special column, for which I\'d

相关标签:
1条回答
  • 2020-12-21 23:41

    If you want precise control over the table column widths you must use CSS:

    table.dataTable thead th:nth-child(4),
    table.dataTable tbody td:nth-child(4) {
      width: 200px;
      max-width: 200px;
      min-width: 200px;
    }  
    

    If you inspect the above column you will see the that computed width is larger than 200px. This is the padding kicking in, so you must reset padding-left and padding-right to get exactly 200px.

    If you want to shrink a column to a width beyond "reasonable" you must add som additional CSS :

    table.dataTable {
      table-layout: fixed;
    }
    

    Why this is needed you can read about here -> https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout#Values

    table.dataTable thead th:nth-child(2),
    table.dataTable tbody td:nth-child(2) {
      word-break: break-all;
      overflow-wrap: break-word;
      width: 20px;
      max-width: 20px;
      padding-right: 0px;
      padding-left: 0px;
    }
    

    demo -> http://jsfiddle.net/n4j1wgu5/

    0 讨论(0)
提交回复
热议问题