Writing modes
text-combine-upright
text-combine-upright sets characters such as digits side by side within the space of one character in vertical text. Known in Japanese typesetting as tate-chu-yoko, it keeps numbers like "10" or "30" upright and easy to read.
Syntax
none | all | [ digits <integer [2,4]>? ]Preview
Code
.box {
writing-mode: vertical-rl;
text-combine-upright: all;
}Controls
About
In vertical text, Latin letters and digits normally run sideways. For a number of about two digits, setting them side by side in the width of one character reads better.
Put this property on an element that wraps only the digits, such as a <span>. Applied to a whole paragraph, it tries to squeeze every run of text into one character. The preview on this page applies it only to the digits of the sample.
Writing the value
none: does nothing, so digits stay sideways. This is the initial value.all: sets every character of the element side by side in the width of one character. With three or more digits, the glyphs get quite narrow.
The spec also has digits, which sets runs of up to 2–4 digits upright automatically, but no browser supports it, so this page does not offer it.