Vertical text in HTML

Not so long ago i had a problem with one site. There was name of user in vertical text.

Link to example

My first thought was “i will use php and generate image for each user”.
But after that i thought that it is bad idea, if there will be many visitors. So i decide to output it using html

writing-mode – This property controls the intrinsic writing direction rendering for a block of content. The default is left-to-right, top-to-bottom common in western languages, but the alternate rendering mode is top-to-bottom, right-to-left which is a common rendering mode used in Asian writing systems.

1	filter: flipv() fliph(); writing-mode: tb-rl;

By using such styles we tell browser to output it vertically. Sad thing is that it is working only in IE.
But a lot of people using FF, Opera.
Scalable Vector Graphics (SVG) – this thing will help me 🙂
You can read about it’s advantages here

For more information click here

2011

01/29

POSTED BY

UIBugs

CATEGORY

HTML & CSS

TAGS

CSS
Div
HTML

Write comment