# Sticky Columns

Sticky columns keep specific columns visible while users scroll the Grid horizontally. The sticky columns still scroll until they reach the left or right Grid border, where they stay fixed.

For a runnable example, review the [Grid sticky columns demo](https://demos.telerik.com/aspnet-mvc/grid/sticky-columns).

To enable sticky columns, configure the Grid as follows:

* Enable [scrolling](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/data-management/grid/scrolling/overview).
* [Stick columns initially](https://docs.telerik.com/aspnet-mvc/api/kendo.mvc.ui.fluent/gridboundcolumnbuilder#stickysystemboolean) or [enable the stickable property](https://docs.telerik.com/aspnet-mvc/api/kendo.mvc.ui.fluent/gridboundcolumnbuilder#stickablesystemboolean) so users can stick columns on the fly.
* Set a Grid height.
* Set explicit pixel widths on all columns so the Grid can calculate sticky and non-sticky column layout.
* Make sure the Grid is not [initialized inside a hidden container](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/data-management/grid/appearance/hidden-containers).

> note The [Grid JavaScript API methods](https://docs.telerik.com/kendo-ui/api/ui/grid#methods) allow users to stick and unstick columns on the fly only when `Stickable(true)` is enabled during initialization.

```Razor HtmlHelper
    .ColumnMenu()
    .Columns(columns =>
    {
        columns.Bound(o => o.ContactName).Sticky(true).Stickable(true).Width(150);
        columns.Bound(o => o.ContactTitle).Stickable(true).Width(250);
        columns.Bound(o => o.CompanyName).Stickable(true).Width(350);
        columns.Bound(o => o.Country).Stickable(true).Width(300);

    })
```

## Known Limitations

* The sticky columns are not supported in Microsoft Internet Explorer. It is a browser limitation due to unsupported gutters.
* Sticky columns cannot work together with [column virtualization](https://demos.telerik.com/aspnet-mvc/grid/column-virtualization).
* A column cannot be both sticky and [locked](https://demos.telerik.com/aspnet-mvc/grid/frozen-columns). If it is defined like this, it will be locked and the sticky property will be ignored.
* Grid scrolling must be enabled.
* The header of the first column in a grouped Grid cannot be sticky.
* The autogenerated expand/collapse columns used by hierarchy and grouping cannot be sticky.
* The [row template](https://demos.telerik.com/aspnet-mvc/grid/rowtemplate) and [detail template](https://demos.telerik.com/aspnet-mvc/grid/detailtemplate) are not supported together with sticky columns.
* If [multi-column headers](https://demos.telerik.com/aspnet-mvc/grid/multicolumnheaders) are used, only a column at the topmost level can be sticky. When the Grid uses Multi-column headers - the "Set Column Position" menu will not be visible.
* If the width of the Grid changes through JavaScript or resizing the page after the Grid is created, you have to call the [`resize` method](https://docs.telerik.com/kendo-ui/api/kendo/methods/resize) to recalculate the sticky styles.

## See Also

* [Implementing Sticky Columns in the Grid (Demo)](https://demos.telerik.com/aspnet-mvc/grid/sticky-columns)
* [Knowledge Base](https://www.telerik.com/aspnet-mvc/documentation/knowledge-base)
* [JavaScript API Reference of the Grid](https://docs.telerik.com/kendo-ui/api/ui/grid)
* [Server-Side API](https://www.telerik.com/aspnet-mvc/documentation/api/grid)
