New to Kendo UI for Angular? Start a free 30-day trial
Column Resizing
The Kendo UI for Angular Gantt enables you to resize the columns of its TreeList pane by dragging the edges (resize handles) of the header cells.
Getting Started
To enable column resizing, set the columnsResizable property of the Gantt to true.
- By default, the column-resizing feature is disabled.
- If the user resizes the Gantt columns so that the total width of the columns becomes less than the width of the TreeList pane, the remaining table is filled with whitespace.
Example
View Source
Change Theme:
Auto-Fitting the Content
You can set the initial width of all TreeList pane columns so that it fits the width of their widest header or cell content by using the columnsAutoSize option of the Gantt. You can also apply this behavior on a per-column basis by using the autoSize column option.
To auto-resize the columns of the Gantt at runtime, use the autoFitColumns() method.
The following example demonstrates how to automatically fit the content of all columns after the Gantt is rendered.
Example
View Source
Change Theme:
