# Sticky Columns

Columns marked as "sticky" are visible at all times while the user scrolls the [Angular Grid](https://www.telerik.com/kendo-angular-ui-develop/components/grid) horizontally. They are stacked at the start or end of the Grid, depending on the scrolling direction.

> Sticky columns are similar to [locked columns](https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/locked), and you can use them to achieve the same effect. They also support placing columns to either side of the viewport. But the two features are not completely interchangeable, see [known limitations](https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/sticky#known-limitations).

## Setup

To set the sticky state of the Grid columns:

* Use their [`sticky`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/columncomponent#sticky) option.
* Ensure that the Grid is [`scrollable`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/scroll-modes) (it is by default).
* Set the [`width`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/columncomponent#width) option of all columns so that the Grid is able to adjust the positions of the sticky columns.

The following example demonstrates how to make certain columns sticky so that they are always visible during horizontal scrolling.

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

## Stick to the Start and End

Sticky columns can be used to emulate the behavior of [`locked columns`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/locked) with the addition of the ability to position columns at either end. To achieve this, make sure that the desired columns are placed at the beginning or end of the columns list and set their [`sticky`](https://www.telerik.com/kendo-angular-ui-develop/components/grid/api/columncomponent#sticky) option to `true`.

The following example demonstrates this approach.

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

## Known Limitations

* The detail template does not work with sticky columns.
* Using sticky columns alongside [multi-column headers](https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/headers) is not supported.

## 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)
