Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create vertical text using only CSS?

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

By vertical I mean

F
O
O

B
A
R
like image 948
Jakub Arnold Avatar asked Dec 30 '22 15:12

Jakub Arnold


1 Answers

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+ (don't have access to IE6 right now). The only thing that is missing from that solution is an extra new line for a space, the result is something like:

F
O
O
B
A
R

like image 168
jeroen Avatar answered Jan 13 '23 13:01

jeroen