CSS writing-mode property

Definition and usage

writing-mode The attribute specifies whether the text lines are arranged horizontally or vertically.

See also:

CSS Tutorial:CSS Text Effects

Example

Specifies whether the text lines are arranged horizontally or vertically:

p.test1 {
  writing-mode: horizontal-tb; 
}
p.test2 {
  writing-mode: vertical-rl; 
}
span.test2 {
  writing-mode: vertical-rl; 
}

Try it yourself

CSS syntax

writing-mode: horizontal-tb|vertical-rl|vertical-lr;

Attribute value

Value Description
horizontal-tb Allow content to flow horizontally from left to right and vertically from top to bottom.
vertical-rl Allow content to flow vertically from top to bottom and horizontally from right to left.
vertical-lr Allow content to flow vertically from top to bottom and horizontally from left to right.

Technical details

Default value: horizontal-tb
Inheritance: Yes
Animation creation: Not supported. See also:Animation-related properties.
Version: CSS3
JavaScript syntax: object.style.writingMode="vertical-rl"

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
48.0 12.0 41.0 11.0 35.0