Как создать вертикальный текст, используя только CSS?

Question

Можно ли создавать вертикальный текст, используя только CSS, совместимый с IE6 +?

Под вертикалью я подразумеваю

F
O
O

B
A
R

Answer 1

Отредактировано: Вы можете попробовать следующее:

p {
  letter-spacing: 1000px;    // more than width of parent 
  word-wrap: break-word;    // seems to work in at least Firefox and IE7+ 
}

Кажется, это работает в Firefox 3.5 и IE7 + (сейчас нет доступа к IE6). Единственное, чего не хватает в этом решении, - это новой строки для пробела, в результате получается что-то вроде:

F
O
O
B

R

Answer 2

Сегодня это невозможно в браузерном режиме. Ждите CSS3.

Answer 3

Это работает в IE, но, к сожалению, не FF:

.verticaltext 
{
    writing-mode: tb-rl;
    filter: fliph flipv;
}

Answer 4

Вы можете достичь чего-то похожего (по крайней мере, в IE), используя этот CSS:

.verticaltext {
  writing-mode: tb-rl;
}

Но это повернёт символы на 90 градусов по часовой стрелке.