Wrap Text in Html.Kendo().Grid column

[Abhijeet]

I have a Html.Kendo().Grid  ASP.Net core 7.0 project. The grid displays several columns, some of them have big text. I want the text to not wrap. The text should show '...' in the end if the text is longer than the grid column. 

I have added 

 .k-grid td {       
     white-space: nowrap;        
 }

but still the text wraps as shown in the attached image.

[Mihaela]

Hello Abhijeet,

You could display the column title text to end with ellipsis ('…') by adding the following CSS style:

<style>
  #grid .k-grid-header .k-column-title {
    text-overflow: ellipsis;
  }
</style>

In case the column title does not render as expected, please share any Grid-related custom CSS styles and the used Kendo UI theme, so I can review them and share a better suggestion.

 

Regards,
Mihaela
Progress Telerik