[CLOSED] Grids - Long header names/wrapping

[adelaney]

What is the correct way to give a grid header text that can wrap?

I have a grid with column headings that are somewhat long. When the columns are shrunk, I would like the label to accommodate. Is that possible? If not, what is the correct way to add a hard break? I have tried "<br/>" in the text, and that does work, but leave a bit to be desired if you want to align the heading. I have also added header items, but that has stylesheet issues as it does not seem t produce the same classes as providing a text value. (To be fair, I added a DisplayLabel as the way to add a header item. Maybe there is some other component that is better - using Razor here.) Finally, I have seen the "group" feature, but I am not trying to have "multiple headers," but rather, a "wrapped header."

Any advice is appreciated. Thanks in advance.

[Daniil]

Hi,

"<br>" works for me.

Though, anyways, it would not help if you need to have wrapped text when a user resizes columns.

The solution is here:
http://www.sencha.com/forum/showthre...l=1#post843595

[Daniil]

Setting up ToolTip for the Column can also be an option.

It's available in v2.1.

[adelaney]

The "<br>" works fine, as does the CSS code. However, one unusual thing is that when combining "<br>" with .Align="right," there seems to be an extra space for the second line. I have verified that the .Text value has no trailing spaces or spaces between the text and the "<br>." Still, the first line overhangs the second. I have looked through the CSS, but can't find anything obvious that would do this. Do you know why this may be? Is there javascript that is adding a space or some padding?

Thanks.

[adelaney]

Found it! This will clear it up:

.x-column-header-align-right .x-column-header-text {margin-right:0px !important; padding-right:0px !important}

[Daniil]

Can we mark the thread as closed?

[adelaney]

Yes you may.