columns.width

Since: DataTables 1.10

Column width assignment.

Description

This parameter can be used to define the width of a column, and may take any CSS value (3em, 20px etc).

Please note that pixel perfect column width is virtually impossible to achieve in tables with dynamic content, so do not be surprised if the width of the column if off by a few pixels from what you assign using this property. Column width in tables depends upon many properties such as cell borders, table borders, the border-collapse property, the content of the table and many other properties. Both DataTables and the browsers attempt to lay the table out in an optimal manner taking this options all into account.

Type

This option can be given in the following type(s):

Default

Auto-detected from the table's content.

Examples

Set the first column's width to 20% with columnDefs:

$('#example').dataTable( {
  "columnDefs": [
    { "width": "20%", "targets": 0 }
  ]
} );

Set the first column's width to 20% with columns:

$('#example').dataTable( {
  "columns": [
    { "width": "20%" },
    null,
    null,
    null,
    null
  ]
} );

Related

The following options are directly related and may also be useful in your application development.