The text-orientation
CSS property defines the orientation of the text characters in a line. This property only has an effect in vertical mode, that is, when writing-mode
is not horizontal-tb
. It is useful for controlling the display of languages that use vertical script, and also for making vertical table headers.
/* Keyword values */ text-orientation: mixed; text-orientation: upright; text-orientation: sideways-right; text-orientation: sideways; text-orientation: use-glyph-orientation; /* Global values */ text-orientation: inherit; text-orientation: initial; text-orientation: unset;
The text-orientation
property is specified as a single keyword from the list below.
mixed
upright
direction
is forced to be ltr
.sideways
sideways-right
sideways
that is kept for compatibility purposes.use-glyph-orientation
glyph-orientation-vertical
and glyph-orientation-horizontal
.mixed | upright | sideways
<p>Lorem ipsum dolet semper quisquam.</p>
p { writing-mode: vertical-rl; text-orientation: upright; }
Specification | Status | Comment |
---|---|---|
CSS Writing Modes Module Level 3 The definition of 'text-orientation' in that specification. | Candidate Recommendation | Initial definition. |
Initial value | mixed |
---|---|
Applies to | all elements, except table row groups, rows, column groups, and columns |
Inherited | yes |
Media | visual |
Computed value | as specified |
Animation type | discrete |
Canonical order | the unique non-ambiguous order defined by the formal grammar |
Desktop | ||||||
---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | |
Basic support | 48
|
? | 41
|
No | Yes
|
No |
sideways |
No | ? | 44
|
No | No | No |
Mobile | |||||||
---|---|---|---|---|---|---|---|
Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | iOS Safari | Samsung Internet | |
Basic support | 48
|
48
|
? | 41
|
No | No | 5.0
|
sideways |
No | No | ? | 44
|
No | No | No |
writing-mode
, text-combine-upright
, and unicode-bidi
.
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/text-orientation