I found a post from last year (January 2008) that helped with setting the text orientation within the header caption to be verticle (90 degrees).
This is how it can be done within the initialize layout sub, where oCol is my UltraWebGrid.UltraGridColumn:
oCol.Header.Style.CustomRules = "WRITING-MODE: tb-rl"
Now, my question is whether there is now a better way of doing this? And can you align/orient the text direction by degrees within the caption?
I have a lot of columns to show but if I can align each column's header caption to the vertical (or at an angle) then I can fit the entire grid on a single page. Note that I am using Infragistics2.WebUI.UltraWebGrid Version=7.3.20073.38 (for CLR 2.0). Just hoping for a better solution. I would imagine that other's would have need of this feature?
Thanks in advance!
Tina
Hello Tina,
UltraWebGrid does not have anything built-in to support that - so the solution with Css is the only one I can think of for vertical align. This actually is a limitation of HTML rendering I am afraid. Rotating the text with an angle is not supported for all browsers - IE browsers support DirectX transition filters that may support that. Other solutions suggest using images instead of text. More info on this topic can be found here:
http://forums.digitalpoint.com/showthread.php?t=70168
Thanks! That seems to work for me. What I wanted was the text to be rotated 270 degrees. And the microsoft gradient worked...
Here is what I did:
Dim strHeaderDivStyle As String = "WRITING-MODE: tb-rl;" 'use other way if not running IEIf Request.Browser.Browser = "IE" Then 'rotate the header caption so that it appears at 270 degrees...this is the best way but will work ONLY for IE browsers strHeaderDivStyle = "width: 90px; FILTER:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);"End IfoCol.Header.Caption = "<div style='" & strHeaderDivStyle & "'>" & oCol.Key & "</div>"
So, setting the caption to a div containing in the text you want to display & adding on a filter style. Note that in order to get this to work you MUST set the width of the div or it will NOT work. Took me a bit of time to figure that one out...