Among other new layout elements, Internet Explorer 5.5 has introduced the writing-mode CSS element. With it, you can cause text to be rendered vertically in the browser window. The writing-mode property has two valid values at this time: "lr-tb" and "tb-rl". The first represents text that flows from left to right and then from top to bottom. This is the standard layout that you're used to seeing on the Web. The second represents top to bottom, right to left. For many languages, such as Chinese and Japanese, this is the preferred textual orientation. But you can use this layout format for English as well. Try this, for example:
- Code: Select all
<div style="writing-mode:tb-rl;width:100%;height:100%">
This is an example of vertical layout!
</div>
One important note: for whatever reason, the <body> of an HTML document can't be set to render vertically; you can only render individual constituents of the page, such as <p>, <span>, and <div> elements vertically. This is why we set the width and height to 100% in the example; this effectively sets the <div> to occupy the entire browser window.