New to Telerik UI for ASP.NET Core? Download free 30-day trial
ASP.NET Core Grid Content Alignment
- EXAMPLE
- VIEW SOURCE
-
Change Theme
defaultDefault Theme
- Main
- Main Dark
- Nordic
- Ocean Blue
- Ocean Blue A11Y
- Purple
- Turquoise
Bootstrap Theme- Main
- Bootstrap 3
- Bootstrap 3 Dark
- Main Dark
- Nordic
- Turquoise
- Turquoise Dark
- Urban
- Vintage
Material Theme- Main
- Arctic
- Lime Dark
- Main Dark
- Nova
Classic Theme- Main
- Green
- Green Dark
- Lavender
- Lavender Dark
- Main Dark
- Metro
- Metro Dark
- Moonlight
- Opal
- Opal Dark
- Silver
- Silver Dark
- Uniform
Fluent Theme- Main
Also available for:
CLIENT-SIDE API SERVER-SIDE APIDescription
The Telerik UI for ASP.NET Core Grid enables you to specify the alignment of its cell content in either of the following ways:
- Through the column definition by using the
HtmlAttributes()
method—columns.Bound(o => o.ShipCity).HtmlAttributes(new { style = "text-align: right" });
. - By applying the
k-text-left
,k-text-right
, ork-text-center
classes—columns.Bound(o => o.ShipCity).HtmlAttributes(new { @class = "k-text-right" });
.
Also, you can update the alignment of the column header through the HeaderHtmlAttributes()
method—columns.Bound(o => o.ShipCity).HeaderHtmlAttributes(new { style = "text-align: center; justify-content: center" });
Additionally, the ASP.NET Core Data Grid enables you to align its column footer by using the FooterHtmlAttributes()
method—columns.Bound(o => o.Freight).FooterHtmlAttributes(new { style = "text-align: right" });
.
This demo shows how to change the alignment of the default column text and value in the ASP.NET Core Data Grid.
For more information about the approaches for taking the best out of the component, refer to the official Telerik UI for ASP.NET Core Data Grid product documentation.