Get affordable and hassle-free WordPress hosting plans with Cloudways — start your free trial today.
The writing-mode property changes the alignment of the text so that it can be read from top to bottom or from left to right, depending on the language. For example, let’s say we want to add some text that is read from top to bottom and from right to left, like this:
.vertical-rl { writing-mode: vertical-rl; }This is most useful in languages such as Chinese, Japanese or Korean where the text is often set vertically. In the English language, it’s more likely that you’ll want to use this property for aesthetics reasons, such as aligning a heading in a block of text like this:
Values
In the examples below I’ve made the first letter of the text red, just so it’s easier to see which direction you need to start reading.
horizontal-tb
This is the default value of the property: text is read from left to right and top to bottom.
vertical-rl
Text is read from right to left and top to bottom:
vertical-lr
Text is read from left to right and top to bottom: