Vertical Text into Column Header Grid

[edp-progetti]

Hi, I ask help to the community.

I would like to set the vertical property to the text of the column header in a grid.

I created this class into css file:


.css-vertical-text {
filter : progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-webkit-transform : rotate(90deg);
-moz-transform : rotate(90deg);
-o-transform : rotate(90deg);
}

then in the render event of the grid...


grid.addListener(Events.Render, new Listener<BaseEvent>() {
public void handleEvent(BaseEvent be) {
Grid grid = (Grid) be.getSource();
GridView view = grid.getView();
for (int i=0;i<30;i++) {
view.getHeaderCell(i).getFirstChildElement().setClassName("css-vertical-text");
}
}
});

I this case the text is corrected shown vertical, but the header is too small.

Now, if I add this code into the "listener" to increase the height of columnHeader:


view.getHeader().setHeight(100);

the header is correct, 100px, but all the column label are shifted to right of 100px, because their height is 100px. If, with FireBug, I remove this property the label goes in the correct position.

I hope to have explained correctly my problem.

Thanks
Carlo

[mtarantini]

I experience the same behavior.

is there any solution ?

thx !

[edp-progetti]

Sorry, but i didn't find any solution.

Bye

[day17]

I was also experimenting with different approaches, but i haven't found anything that works across both IE and FireFox :((

Has anyone found the solution?
If not, maybe GXT team can suggest something?

Thanks