Horizontal-in-vertical (tate-chu-yoko) lacks support, especially for the digits value
Nobody has claimed this yet.
- Dominant language
- HTML
- Stars
- 809
- Forks
- 66
- Avg merge
- 19m
- Merged PRs (30d)
- 1
Description
This issue is applicable to Chinese, Japanese, Korean, & Mongolian.
In vertically set text, it is normal to display numbers with 2-3 digits and sometimes up 4 (and sometimes other things) horizontally within a one character space. This is particularly common for things such as day and month digits. This is often referred to using the japanese name, tate chu yoko.

The GAP
In writing-modes CSS provides 2 solutions to enable tate chu yoko.
text-combine-uprightproperty with theallvalue makes everything within the element to which it is attached horizontal. It has to be applied to each location where the presentation needs to be changed.digits <integer>identifies numbers with a given digit count within the element styled, and presents them horizontally. If the integer is omitted, the default is 2. This is much easier to use, because it can be applied to a paragraph or section, etc. and instances will be found automatically.
The CSS text-combine-upright property works with the all value in Gecko and Blink browsers, but not in Webkit. (Webkit supports the proprietary property -webkit-text-combine:horizontal.)
No major browsers support the digits value, with or without a following digit, which is a shame since it is a better approach to the problem.
(The CSS digits value was supported by Legacy Edge with it's proprietary property name, but single digits were stretched to fit the width of the (vertical) line. The new (Blink-based) Edge no longer supports it.)
Priority:
The unavailability of the digits value is an inconvenience, since more interventions and markup are needed when using the all value. Since the all value can be used with most browsers, this is classed as Advanced, but really it is probably close to Basic.
Tests
Interactive test, text-combine-upright:all will make up to 4 characters run horizontally in vertical text, and not exceed the line width.
Interactive test, text-combine-upright:digits set on a parent element will make up to 2 digits run horizontally in vertical text, without special markup, but not longer numbers
Action taken
Browser bug reports: Chromium • Webkit • Mozilla
Outcomes
Webkit now supports text-combine-upright: all without a prefix. This means that Blink, WebKit, and Gecko browser engines now all support this property-value combination.
Support is still lacking, however, for the more useful digits value.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the three linked interactive tests and compare their expected behavior with the CSS Writing Modes text-combine-upright definition. Review the linked Chromium, WebKit, and Mozilla reports to understand the remaining support gap; done should mean the clreq requirement and expected digits behavior are clearly updated or otherwise resolved.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- internationalization
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100