How to create vertical text using only CSS?

Question

Is it possible to create vertical text using only CSS compatible with IE6 +?

Vertically, I mean

F O O B A R 

Answer 1

Edited: You can try the following:

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

This seems to work in Firefox 3.5 and IE7 + (I don't have access to IE6 now). The only thing missing from this solution is an extra new line for the space, resulting in something like:

F
O
O
B
A
R

Answer 2

Today this is not possible in the browser in an agnostic way. Wait for CSS3.

Answer 3

This works in IE, but unfortunately not FF:

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

Answer 4

You can achieve something similar (at least in IE) with this CSS:

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

But this will rotate the characters 90 degrees clockwise.