Back to Vertical Page | Back to Chinese | Back to Japanese | Back to Korean
If the test works, then the gray box on the left will be identical to the gray box on the right.
| Graphic | Actual Styled Text |
|---|---|
 |
If you see this as vertical text, then your broswer supports the tb:rl CSS attribute. If the text is horizontal, then there is no support. |
CSS3 does include the transform:rotate property which is supported in very new browswers along with older browser-specific alternatives.
Note that while this results in vertical text in new browsers, the letter forms are also rotated. You may also need to compensate for how the text is placed since it may overlap other text.
See some examples below with rotated text in red beneath each CSS.
Note: Actual CSS includes browser extensions. See the source code of this page for actual CSS.
.d90
{
color:red;
float:left;
transform: rotate(90deg);
/* + Browser extensions */
}
.d270
{
color:red;
float:left;
transform: rotate(-90deg);
}
.d180
{
color:red;
float:left;
transform: rotate(-90deg);
}