The text-combine-upright CSS property sets the combination of characters into the space of a single character. If the combined text is wider than 1em, the user agent must fit the contents within 1em. The resulting composition is treated as a single upright glyph for layout and decoration. This property only has an effect in vertical writing modes.

This is used to produce an effect that is known as tate-chū-yoko 縦中横 in Japanese, or as 橫向文字 in Chinese.

Try it


/* Keyword values */
text-combine-upright: none;
text-combine-upright: all;

/* Digits values */
text-combine-upright: digits; /* fits 2 consecutive digits horizontally inside vertical text */
text-combine-upright: digits 4; /* fits up to 4 consecutive digits horizontally inside vertical text */

/* Global values */
text-combine-upright: inherit;
text-combine-upright: initial;
text-combine-upright: revert;
text-combine-upright: revert-layer;
text-combine-upright: unset;



There is no special processing.


Attempts to typeset all consecutive characters within the box horizontally, such that they take up the space of a single character within the vertical line of the box.

digits <integer>?

Attempts to display a sequence of consecutive ASCII digits (U+0030–U+0039) that has as many or fewer characters than the specified integer, such that it takes up the space of a single character within the vertical line box. If the integer is omitted, it computes to 2. Integers outside the range of 2-4 are invalid.

Formal definition

Initial valuenone
Applies tonon-replaced inline elements
Computed valuespecified keyword, plus integer if 'digits'
Animation typeNot animatable

Formal syntax

text-combine-upright = 
none |
all |
[ digits <integer [2,4]>? ]


Using 'all' with horizontal text

The all value requires markup around every piece of horizontal text, but it is currently supported by more browsers than the digits value.


<p lang="zh-Hant">
  民國<span class="num">105</span><span class="num">4</span><span


html {
  writing-mode: vertical-rl;
  font: 24px serif;
.num {
  text-combine-upright: all;



CSS Writing Modes Level 4
# text-combine-upright

Browser compatibility

BCD tables only load in the browser

See also