Search code examples
cssvertical-alignmentbaseline

Do East Asian (e.g. Chinese) characters have baselines? How do they align with English in CSS?


I am asking this because I want to know how East Asian Characters (e.g. Chinese) align with English ones in CSS.

This is what Wikipedia.org says:

East Asian scripts have no baseline; each glyph sits in a square box, with neither ascenders nor descenders. When mixed with scripts with a low baseline, East Asian characters should be set so that the bottom of the character is between the baseline and the descender height.

Source link: Baseline (typography)

Is that true?

If East Asian characters do not have baselines, how do they align with English in CSS, which has the baseline?


Solution

  • Chinese and other Asian characters indeed do not have a baseline. They're fitted into square boxes instead which form a grid on the page.

    grid

    wiki

    You see that the characters form exact columns in a precise grid, each character taking exactly as much width and height as every other character. As Wikipedia is also correctly saying, aligning this with Latin script should be done by aligning the bottom of the square between the baseline and the descender, which my browser at least does:

    alignment