writing-mode
Defines whether lines of text are laid out horizontally or vertically, and the direction in which blocks progress. This is essential for supporting languages like Chinese, Japanese, or Arabic, and for creative layouts like vertical sidebars.
Quick example
.vertical-text {
/* rotates the text blocks to flow vertically from top to bottom */
writing-mode: vertical-rl;
}Quick facts
Initial value
horizontal-tbInherited
Yes
Applies to
all elements except table row/column groups, rows, and columns
Animation type
notAnimatable
Values
horizontal-tbvertical-rlvertical-lrsideways-rlsideways-lr writing-mode Browser Support
Widely available Since 2017 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2017.
Safe to use without fallbacks.
48+
41+
10.1+
12+