columns.width String|Number

The width of the column. Numeric values are treated as pixels. The width option supports the fundamental measuring units. For instance:

  • px sets the width in pixels
  • cm sets the width in centimeters
  • mm sets the width in millimeters
  • % sets the width relative to the grid's element width
  • em sets the width relative to the font-size of the grid's element width
  • rem sets the width relative to font-size of the root element

For more important information, please refer to Column Widths.

Grid options, including column widths, can be set programmatically after Grid initialization with the setOptions method.

Example - set the column width as a string

 <div id="grid"></div>
 <script>
 $("#grid").kendoGrid({
   columns: [
     { field: "name", width: "200px" },
     { field: "age" }
   ],
   dataSource: [
     { name: "Jane Doe", age: 30 },
     { name: "John Doe", age: 33 }
   ]
 });
 </script>

Example - set the column width as a number

 <div id="grid"></div>
 <script>
 $("#grid").kendoGrid({
   columns: [
     { field: "name", width: 200 },
     { field: "age" }
   ],
   dataSource: [
     { name: "Jane Doe", age: 30 },
     { name: "John Doe", age: 33 }
   ]
 });
 </script>
In this article
Not finding the help you need? Improve this article