starred/radzen-blazor
1
0
Fork 0
mirror of https://github.com/radzenhq/radzen-blazor.git synced 2026-02-04 05:35:44 +00:00
Code Issues 1.3k Packages Projects Releases 22 Wiki Activity

[Feature Request] - WrapText property for RadZenColumn #823

New Issue
Closed
opened 2026-01-29 17:44:56 +00:00 by claunia · 2 comments
claunia commented 2026-01-29 17:44:56 +00:00
Owner
Copy Link

Originally created by @jafin on GitHub (Apr 20, 2023).

Request: Ability to wrap Text inside a RadzenDataGridColumn

It would be useful to expose a property to allow a column content to be wrapped.
At present, it appears it is only controlled via CSS.
For example td has the white-space:no-wrap fixed and the .rz-cell-data style also has white-space:no-wrap set.
So to override this at present, you either need to amend the stylesheet, or add an override CSS style with !important

Possible implementation could be as simple as, depending on the property set, conditionally add/remove a CSS utility class that wraps/not wraps content.

i.e.

.rz-no-wrap { 
  white-space: nowrap;
}

The CSS class .rz-text-wrap is already defined but uses an !important. Would be preferable if the !important was not mandatory (if it were to be used)

An Example markup may look like:

<RadzenDataGridColumn 
     TItem="InstanceModel" 
     Property="BigText" 
     Title="Lots of Big Text"
     WrapText="true" HeaderWrapText="true" />

How other libraries do it.

ag-grid exposes a prop of wrapText:boolean
https://ag-grid.com/javascript-data-grid/row-height/#text-wrapping

Expanded scope (Header col)

Consider applying to Header column as well (I have not checked if Header columns allow wrapping, but if not would make sense to allow them as well using a similar property

Originally created by @jafin on GitHub (Apr 20, 2023). <!-- IMPORTANT: Read this first!!! 1. If you own a Radzen Professional or Еnterprise subscription you can request your feature via email at info@radzen.com. Radzen staff will reply within 24 hours (Professional) or 16 hours (Enterprise) 2. The Radzen staff guarantees a response to issues in this repo only to paid subscribers. 3. If you have a HOW TO question start a new forum thread in the Radzen Community forum: https://forum.radzen.com. Radzen staff will close issues that are HOWTO questions. 4. Please adhere to the issue template. --> ## Request: Ability to wrap Text inside a RadzenDataGridColumn It would be useful to expose a property to allow a column content to be wrapped. At present, it appears it is only controlled via CSS. For example `td` has the `white-space:no-wrap` fixed and the `.rz-cell-data` style also has `white-space:no-wrap` set. So to override this at present, you either need to amend the stylesheet, or add an override CSS style with `!important` Possible implementation could be as simple as, depending on the property set, conditionally add/remove a CSS utility class that wraps/not wraps content. i.e. ```css .rz-no-wrap { white-space: nowrap; } ``` The CSS class `.rz-text-wrap` is already defined but uses an `!important`. Would be preferable if the !important was not mandatory (if it were to be used) An Example markup may look like: ```html <RadzenDataGridColumn TItem="InstanceModel" Property="BigText" Title="Lots of Big Text" WrapText="true" HeaderWrapText="true" /> ``` ## How other libraries do it. ag-grid exposes a prop of `wrapText:boolean` https://ag-grid.com/javascript-data-grid/row-height/#text-wrapping ## Expanded scope (Header col) Consider applying to Header column as well (I have not checked if Header columns allow wrapping, but if not would make sense to allow them as well using a similar property
claunia added the enhancement label 2026-01-29 17:44:56 +00:00
claunia commented 2026-01-29 17:44:57 +00:00
Author
Owner
Copy Link

@yordanov commented on GitHub (Apr 20, 2023):

Just a note that in addition to .rz-text-wrap and .rz-text-nowrap there is also .rz-text-truncate, see Typography demo.

image
@yordanov commented on GitHub (Apr 20, 2023): Just a note that in addition to `.rz-text-wrap` and `.rz-text-nowrap` there is also `.rz-text-truncate`, see [Typography](https://blazor.radzen.com/typography#text-wrap) demo. <img width="205" alt="image" src="https://user-images.githubusercontent.com/1118895/233392383-de03b3c0-dbc5-4f52-882c-d3d7539b3a8c.png">
claunia commented 2026-01-29 17:44:57 +00:00
Author
Owner
Copy Link

@pedro-cons commented on GitHub (Apr 6, 2025):

Hi @yordanov,

A few weeks ago, I submitted PR #1999 based on your suggestion, adding WhiteSpaceText and HeaderWhiteSpaceText to RadzenDataGridColumn.

This enables text wrapping without relying on custom CSS overrides, making it much easier to control layout through component parameters.

Just checking, can this issue be closed now that the feature is in place?

Thanks!

@pedro-cons commented on GitHub (Apr 6, 2025): Hi @yordanov, A few weeks ago, I submitted PR [#1999](https://github.com/radzenhq/radzen-blazor/pull/1999) based on your suggestion, adding WhiteSpaceText and HeaderWhiteSpaceText to RadzenDataGridColumn. This enables text wrapping without relying on custom CSS overrides, making it much easier to control layout through component parameters. Just checking, can this issue be closed now that the feature is in place? Thanks!
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
enhancement
good first issue
pull-request
Mirrored from GitHub Pull Request
No Label enhancement
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
claunia
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/radzen-blazor#823
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?