Как создать вертикальный текст, используя только 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), используя этот CSS:

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

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

Answer 4

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

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