Set fixed column width

mklinger

I am struggling with column widths in my table. The "columnDefs" option has no effect on my table. Column widths are still automatically set.
Here is my table setup:

var table = jQuery('#example').DataTable( {
    data: dataSet,
    /*dom: 'Bfrtip',
    buttons: [
        'copy', 'excel', 'pdf'
    ],*/
    "scrollY": "555px",
    "scrollX": false,
    "paging": false,
    "ordering": false,
    "autoWidth": false,
    "fixedHeader": {
        "header": false,
        "footer": false
    },
    "columnDefs": [
      { "width": "10px", "targets": 0 },
      { "width": "40px", "targets": 1 },
      { "width": "100px", "targets": 2 },
      { "width": "70px", "targets": 3 },
      { "width": "70px", "targets": 4 },
      { "width": "70px", "targets": 5 }
    ],
    "rowCallback": function( row, data, index ) {
      //console.log(index, data);
      for(n=6;n<55;n++){
          var color = (data[n] == 1) ? 'green' : ((data[n] == 2) ? 'yellow': ((data[n] == 3) ? 'red' : 'grey'));
          jQuery('td:eq('+n+')', row).css('background-color', color);
          jQuery('td:eq('+n+')', row).css('color', color);
      }
    },
    "headerCallback": function( thead, data, start, end, display ) {
      jQuery(thead).find('th').eq(0).css('width', '300px');
    },
    "drawCallback": function( settings ) {
        var api = new jQuery.fn.dataTable.Api( settings );

        // Output the data for the visible rows to the browser's console
        // You might do something more useful with it!
        console.log( api.rows( {page:'current'} ).data() );
    }
        /*console.log(cellData);
        var color = (cellData === 99) ? 'blue' : 'red';
        jQuery(td).css('color', color);*/
} );

Any ideas?
Many thanks in advance!

mklinger

Fixed this issue by using following css code:

table{
  margin: 0 auto;
  width: 100%;
  clear: both;
  border-collapse: collapse;
  table-layout: fixed; // ***********add this
  word-wrap:break-word; // ***********and this
}

ThomD

Thanks for sharing. I may need this.