RadzenTable

Radzen.Blazor Components
1

Hi,

If the data in a RadzenTableCell exceeds the width, it is truncated with an added ellipsis (3 dots).

I know I can wrap the contents in a div with class “rz-text-wrap”, but is there an easier way to show the full contents? A property I can set on the cell, perhaps?

I could also add a “title” tag to show the full contents when the mouse hovers, but it would be nice if that was a default property. I would like to avoid having to adjust each cell when I have longer contents.

Thanks,

Mike

2

There's no dedicated property on RadzenTableCell to disable the truncation - it comes from CSS on the inner .rz-cell-data span (overflow:hidden; text-overflow:ellipsis; white-space:nowrap). Two clean options without wrapping each cell:

  1. Show full content table-wide - add one CSS rule:

.rz-data-cell .rz-cell-data {
white-space: normal;
overflow: visible;
text-overflow: clip;
}

(Scope it by giving the table a class.)

  1. Keep the ellipsis but show full text on hover - RadzenTableCell forwards unmatched attributes to the , so just add a title:

@item.Description

Side note: if you're showing tabular data, RadzenDataGrid is usually a better fit - its columns expose properties for this directly.