# Content Alignment

By default, Grid cell content is left-aligned.

The alignment methods in this article apply to cells generated from the column definitions. If you use a [`ClientRowTemplate()`](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/data-management/grid/templates/row-templates), the template defines the `<tr>` and `<td>` markup, so apply the alignment class or style directly to the relevant `<td>` elements in the template.

## Cell Content

To change the content alignment of the Grid, use either of the following approaches:

* Apply a `text-align` style to the column definition by using the `HtmlAttributes()` method.

  ```Razor HtmlHelper
      .Columns(columns =>
      {
          columns.Bound(o => o.OrderID).HtmlAttributes(new { style = "text-align: right" });
      })
  ```

* Apply the `k-text-left`, `k-text-right`, or `k-text-center` classes to the column definition by using the `HtmlAttributes()` method.

  ```Razor HtmlHelper
      .Columns(columns =>
      {
          columns.Bound(o => o.OrderID).HtmlAttributes(new { @class = "k-text-right" });
      })
  ```

## Column Headers

Set the alignment of the column headers through the `HeaderHtmlAttributes()` method.

```Razor HtmlHelper
    .Columns(columns =>
        {
            columns.Bound(o => o.OrderID).HeaderHtmlAttributes(new { style = "text-align: right; justify-content: flex-end;" });
        })
```

## Column Footers

When a column has a footer, change the alignment of its content by using the `FooterHtmlAttributes()` method.

```Razor HtmlHelper
    .Columns(columns =>
        {
            columns.Bound(o => o.OrderID).FooterHtmlAttributes(new { style = "text-align: center" });
        })
```

## See Also

* [Content Alignment of the Grid HtmlHelper for ASP.NET MVC (Demo)](https://demos.telerik.com/aspnet-mvc/grid/cell-alignment)
* [Grid server-side API reference for ASP.NET MVC](https://www.telerik.com/aspnet-mvc/documentation/api/grid)