Как выровнять повернутый текст в таблице?

Я узнал, как повернуть текст (спасибо SO) на 90 °, проблема в том, что текст отображается вертикально, но (я думаю) поле рассчитывается горизонтально (как до поворота).

У меня есть ячейка таблицы, которая содержит такой повернутый текст, и я хотел бы выровнять текст поверх ячейки. В результате я получаю что-то вроде этого:

Текст перед поворотом:

rotated90

Текст после поворота (извините за мой ASCII-скриншот):

0
9
d
e
t
a
t
o
r

Повернутый текст, выровненный по верхней части ячейки:

0
9
d
e
-----------
t
a
t
o
r

Так что часть текста на самом деле находится над ячейкой, что плохо.

Желаемый эффект:

-----------
0
9
d
e
t
a
t
o
r

ВОПРОС: как выровнять текст по вертикали, т.е. как сделать так, чтобы браузер видел поле как после (а не до) поворота?


html alignment css tablelayout
person greenoldman    schedule 13.05.2011    source источник
comment
Метод IE (writing-mode) правильно поворачивает блочную модель элемента, но это не похоже на то, что делают браузеры Webkit/Mozilla. :(   -  person drudge    schedule 13.05.2011
comment
@jnpcl, спасибо, что напомнили об этом, но на самом деле это слишком ограничивает, ведь даже я не использую Windows в качестве основной системы.   -  person greenoldman    schedule 13.05.2011

Ответы (1)


arrow_upward
1
arrow_downward

Не похоже, что это возможно без указания высоты ячейки, в которой находится повернутый текст.

Webkit/Mozilla выполняет поворот отображения элемента, но не его блочной модели.

Свойство CSS3 writing-mode правильно работает в IE, вращая блочную модель. Это свойство должно поддерживаться большинством браузеров, но в статье, которую я прочитал, говорилось, что в то время оно поддерживалось только IE.

person drudge    schedule 13.05.2011
comment
Так как я никуда не тороплюсь, то оставлю свой текст горизонтально, а через какое-то время поверну с помощью режима письма. О боже, WWW это все, кроме сохранения стандартов :-). - person greenoldman; 13.05.2011