How to align rotated text in the table?
I found out how to rotate the text (thanks to SO) by 90°, the problem is the text i开发者_JAVA技巧s rendered vertically, but (I guess) the box is calculated horizontally (as before rotating).
I have table cell which contains such rotated text, and I would like to align the text at top of the cell. As the result I get something like this:
Text before rotation:
rotated90
Text after rotation (please excuse my ASCII screenshot):
0
9
d
e
t
a
t
o
r
Rotated text aligned to top of the cell:
0
9
d
e
-----------
t
a
t
o
r
So part of the text is above the cell actually, which is bad.
Desired effect:
-----------
0
9
d
e
t
a
t
o
r
QUESTION: how to align text vertically, i.e. how to make browser see the box as after (not before) rotattion?
It doesn't look like this is possible without specifying the height of the cell that the rotated text is in.
Webkit/Mozilla performs the rotation on the element's display, but not its box model.
The CSS3 property writing-mode
works properly in IE, rotating the box model. This property should be supported by most browsers, but the article I read said it was only supported by IE at the time.
精彩评论