How add a custom class for header text

2 posts, 0 answers
  1. SturmA
    SturmA avatar
    1 posts
    Member since:
    Jul 2016

    Posted 21 Sep 2020 Link to this post


    I want to rotate the header text to 90 degree.

        .rotate-text {
            float: left;
            line-height: 0.7;
            -ms-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
            margin: 0;
            padding: 0;
    columns.Bound(c => c.Number).ClientHeaderTemplate("<div class='' >#=???#</div>");


    How can i access the original header text inside of the template ?


  2. Georgi Denchev
    Georgi Denchev avatar
    79 posts

    Posted 23 Sep 2020 Link to this post

    Hello, Arthur

    Thank you for providing a code snippet.

    If I may suggest a slight touch-up, we could use HeaderHtmlAttributes instead of ClientHeaderTemplate.

    Then we can directly apply the class to the particular column header.

    columns.Bound(c => c.Number).HeaderHtmlAttributes(new { @class = "rotate-text" });

    If this suggestion does not resolve your problem, please let me know.


    Georgi Denchev
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at

Back to Top