# Locked Columns

Locked (frozen) columns are the columns that are visible at all times while the user scrolls the [Kendo UI for Angular Grid](https://www.telerik.com/kendo-angular-ui-develop/components/grid) horizontally.

## Prerequisites

The Kendo UI Grid for Angular enables you to toggle the locked (frozen) state of its columns.

To allow the component to adjust the layout of its frozen and non-frozen columns and for the feature to work properly, make sure that:

* Scrolling is enabled.
* The [`height`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/gridcomponent#height) option of the Grid is set.
* The widths of all Grid columns are explicitly set in pixels so that the Grid is able to adjust the layout of the locked and unlocked columns.
* The total width of the locked columns does not exceed the width of the available viewport or the width of the Grid, if `width` is explicitly set.

## Setup

The Grid supports locked columns on the left side of the table (or on the right side when the Grid is in RTL mode).

The following example demonstrates how to set up locked columns in the Grid.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/configuration/locked-columns/source.txt)

## Known Limitations

* The detail template does not work with locked columns.
* When you lock columns in the Grid, leave at least one unlocked column. If you need to hide all non-locked columns, unlock one of the locked columns before you hide the last non-locked column.
* Touch-scrolling locked columns is not possible because they are wrapped in a container with the `overflow:hidden` style. To work around this limitation on desktop devices, use the `wheel` event. Currently, the Grid does not support a workaround for touch devices.
* When the Grid data is [grouped](https://www.telerik.com/kendo-angular-ui-develop/components/grid/grouping/basics), the group header row will be cut off at the locked section. This can hide group header content if the locked section is too narrow.
* Individual child columns within a [`<kendo-grid-column-group>`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/columngroupcomponent) cannot be locked independently. The locked state must be applied to the entire column group as a single unit.

## Suggested Links

* [ColumnComponent](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/columncomponent)
* [API Reference of the GridComponent](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/gridcomponent)
* [API Index of the Grid](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api)
