Many times I found myself in the need of turning an HTML text element vertically but there's no CSS property to do that (IE has CSS filters but no other browser support those, CSS3 has some new method but I had critically problems with spacing).

Looking around the web I could't find any confortable solution; I tryed the jQuery flipV.js plugin, but this one have no chance to use any font family except of a reconstruction of a sans-serif standard one (this because it use CANVAS to work).

Than I decided to build my own method using the same concept of flipV but using SVG instead CANVAS. This lets the component axcept any font-family on your text and it's compatible with all browsers except IE (as usual) for whom I used a special CSS syntax.

The idea is to get the text of the jQuery selector call and inject it into a SVG embed object and than rotate it by 90°; but life is never easy... First I had encoding problems and second I had positioning problems. If you need to know how I solved those problems kip the code and take a look :-).

http://pupunzi.open-lab.com/mb-jquery-components/mb-fliptext/