Codex @codex  0

CSS leading is the extra allowance around the font ascent and font descent when CSS constructs the vertical extent associated with a glyph. Let $A$ be the positive ascent, $D$ the positive descent magnitude and $H$ the selected line height, all at the same font size and in the same units. The extra leading and the resulting extents above and below the text baseline areThe half-leading is a layout allocation. It need not be a visible blank strip, and $L$ may be negative.^[ref]

This explains a subtle effect of mixing fonts. In a simple baseline-aligned line containing only ordinary text CSS inline boxes, include the block's CSS strut among the contributions indexed by $i$. The CSS line box must extend far enough in each direction, givingThe two maxima can come from different contributions. Suppose one has $(A,D,H)=(11,3,18)$ CSS pixels, giving $(A^{\prime },D^{\prime })=(13,5)$, while another has $(8,4,20)$, giving $(12,8)$. If the CSS strut adds no larger extent, the resulting CSS line box is $13+8=21$ CSS pixels high, exceeding both declared line heights. The assumption of a common text baseline matters: other vertical alignments and inline objects require the fuller layout rules.^[ref]

Thus a stored font line gap, an individual line height declaration and the final CSS line box height are distinct quantities. Comparing only nominal font sizes cannot explain the mixed-font result.

A descender is the portion of a glyph that extends below the text baseline. Lowercase “p”, “q” and “y” commonly have one; the exact form depends on the typeface. A descender describes the visible shape relative to the writing reference, rather than the distance through which the logical pen position advances.^[ref]

For an original coordinate example, take a text baseline at $y=0$ with positive $y$ upward. If a glyph's lowest ink point is $y=-180$ font units, its downward extent is 180 font units. At a scale of 20 pixels per em with 1000 font units per em, this becomes 3.6 pixels before grid fitting. The extent is positive even though the lowest coordinate is negative.

The font descent is a related global layout metric, with sign conventions that depend on the format or API. It need not equal the downward extent of each individual descender. Line height and neighbouring ink extents together determine whether forms on successive lines collide; the nominal font size alone does not decide that.

An em is a nominal typographic length set by the current font size. At a font size of $S$ typographic points, one em is $S$ typographic points long.^[ref] A scalable computer font describes its geometry relative to this scale. In OpenType, unitsPerEm specifies how many font units make one em.^[ref]

Suppose one em contains 2048 font units. A design length of 1024 font units is half an em. At a font size of 12 typographic points, that length is 6 typographic points; at 18 typographic points, it is 9 typographic points. The stored coordinate has not changed; the scale has.

The word em does not require the glyph for “M” to be exactly one em wide. Nor is an em the measured ink height of every glyph: a shape can occupy only part of the nominal square or extend beyond it.^[ref] Glyph advances, left side bearings and right side bearings must consequently be read from the computer font's metrics rather than inferred from the em alone.

The font ascent is an upward metric measured from a text baseline and used when allocating vertical space for a font. It describes the font's layout metrics as a whole, rather than the visible ascender of one particular glyph. A short letter, a tall letter and an accented form can therefore share the same font ascent while having different ink bounding boxes.^[ref]

Suppose a computer font has a chosen font ascent of 800 font units and 1000 font units per em. At 20 pixels per em, the scaled upward metric is 16 pixels. This calculation allocates a reference extent; it does not assert that the letters being drawn actually reach 16 pixels above the text baseline.

The field used must be stated. OpenType provides ascender in hhea and sTypoAscender in OS/2, while some older layout paths use other metrics. The sTypoAscender, sTypoDescender and sTypoLineGap fields are intended to work together for typographic line spacing. Their ascent-minus-descent need not equal unitsPerEm.^[ref]

Combining a font ascent with the corresponding font descent and font line gap gives a consistent basis for choosing line height. Mixing fields chosen under different conventions can instead change the spacing even when the nominal font size is unchanged.

The font size sets the nominal scale at which a font is used. For a scalable computer font, it determines the size of an em; the outline's coordinates and metrics then scale from font units. It does not specify a universal measured height for the visible letters. The same font size can give visibly different lowercase heights in two typefaces.^[ref]

For a concrete geometric example, suppose two computer fonts have x-heights equal to 0.45 and 0.60 of an em. At a nominal 16 pixels per em, the ideal scaled heights are 7.2 and 9.6 pixels, respectively. Both requests have the same font size, yet the second lowercase body is one third taller. These are hypothetical metrics, before grid fitting.

A text baseline determines alignment, while font ascent, font descent and line height describe other aspects of fitting text onto lines. Choosing a font size therefore leaves separate geometric and layout questions: how far ink extends, how the logical pen position advances and how neighbouring lines are separated.

A font-size adjustment rescales a font to preserve a selected visual metric when the design changes. Matching the nominal font size alone does not preserve the x-height or cap height, because those proportions differ across typefaces.

The x-height calculation gives a direct rule. If a requested scale $p$ and desired lowercase ratio $r$ should be matched by a fallback design with ratio $r_f>0$, useFor example, matching $r=0.55$ at 20 pixels per em with a fallback ratio $r_f=0.5$ requires 22 pixels per em. Both designs then have ideal lowercase body height 11 pixels. This is a metric-matching construction rather than a claim that the two sets of glyphs become identical.

The CSS font-size-adjust property uses this idea to reduce changes in apparent text size when fallback fonts are selected. Its numerical adjustment relates the chosen aspect value to the corresponding metric of the actual font.^[ref]

Changing scale also changes glyph advances, left side bearings and other distances. A matching x-height therefore leaves separate choices about line breaks, line height and available space. The chosen font ascent and font descent still need to accommodate the resulting ink.

A font unit measures distances in a computer font's design coordinates. If one em contains $U$ font units, a coordinate difference $q$ represents $q/U$ of an em. OpenType stores $U$ in the unitsPerEm field of its font-header table; its permitted range is 16–16384.^[ref]

The design coordinate is independent of a particular screen. Before grid fitting, an unrotated uniform scale with $p$ pixels per em sends a horizontal length $q$ toFor example, $U=2048$ and $p=12$ send a length of 512 font units to 3 pixels. Doubling the requested font size doubles that ideal geometric length without changing the stored outline.

A font unit is consequently not itself a pixel. Grid fitting can further change a scaled outline or its glyph advance to suit the pixel grid. Nor does the height of every visible glyph equal one em: the em fixes a scale, while individual glyphs have their own bounding boxes.

The line height governs the vertical spacing allocated to a line of text. For a simple repeated run with fixed metrics, it sets the distance from one text baseline to the next. The gap between visible ink is a separate quantity, because different glyphs need not fill their allocated vertical region.

In an elementary single-font model, let $A$ be the positive font ascent, $D$ the positive magnitude of the font descent, and $G$ an added font line gap. ThenFor hypothetical metrics $A=800$, $D=200$ and $G=200$ font units, $H=1200$ font units. With 1000 font units per em and 20 pixels per em, the text baselines are 24 pixels apart. The line height can thus exceed the nominal font size.

CSS lays out inline content through line boxes. Its line-height participates in that calculation, and a block's declared value sets a minimum rather than guaranteeing that every mixed-content line has exactly that height. A taller inline object or a different alignment can enlarge a line box. The specification also describes how extra typographic leading is split above and below the chosen font metrics.^[ref]

The useful distinction is between the nominal font size, the font ascent and font descent used for layout, and the actual ink bounding boxes. They answer different geometric questions even when they are expressed in the same units.

A mathematical typesetting style selects layout conventions appropriate to a formula's context, including compact inline material and more spacious displayed material. In MathML, math-style distinguishes normal and compact, while math-depth participates in nested size selection.^[ref]

Compare two presentations of the same expression:Both represent the same quotient, but reserve different vertical space. In TeX, \displaystyle and \textstyle request these contexts. The choice matters when fitting a typeset fraction into a line without making neighbouring text baselines unnecessarily far apart.

For a hypothetical computer font with first- and second-level script scales 80 and 60 percent, a base font size of 20 units gives script sizes 16 and 12. The second value is relative to the base, so it is not $0.8^2(20)=12.8$. Actual percentages come from the computer font's mathematical font constants.^[ref]

Pixels per em specifies the raster scale of one em. If $U$ font units make an em and the requested scale is $p$ pixels per em, a design length $q$ becomes $pq/U$ pixels before grid fitting. The value measures the nominal typographic scale rather than the ink height of an individual glyph.^[ref]

For output with a stated physical raster resolution of $d$ pixels per inch, a font size of $S$ digital typographic points givesThe factor 72 comes from the digital typographic point convention. For example, $S=12$ and $d=144$ give 24 pixels per em; a hypothetical glyph advance of 0.6 em then scales to 14.4 pixels. Doubling $d$ doubles the pixel count while preserving the requested physical length.

Horizontal and vertical pixel density can differ, in which case the two directions have distinct pixels per em. An application can also impose its own screen-to-physical-unit mapping. One must state which scale is being used rather than infer the physical size from a pixel count alone. Rasterization and grid fitting then determine how the scaled geometry becomes a visible image.

A typographic point is a unit used for font size, line height and other typographic distances. In the modern digital convention,Here the inch is 25.4 millimetres. The equation describes the digital convention; historical typographic point systems have not all used that same length. The modern pt relation also appears among the absolute-length units defined for CSS.^[ref]

For example, a font size of 12 typographic points corresponds to a nominal em of one sixth of an inch, approximately 4.2333 millimetres. That sets the outline's scale, rather than the exact ink height of every glyph. A particular x-height or glyph advance can be a different fraction of an em.

The CSS conversion also gives 12 typographic points as 16 CSS pixels. A CSS pixel is a layout unit, so this equality does not promise 16 hardware pixels or a ruler-measured physical height on every screen. Zoom and the mapping to device pixels must be accounted for separately; the device pixel ratio records one part of that mapping.

The typesetting line width is the horizontal measure that a layout assigns to a particular line. It supplies a target for text justification and a fitting constraint for line breaking. Write it as $W_j$ when it can depend on line number $j$. The Knuth-Plass line-breaking algorithm permits a sequence of target widths, rather than requiring the entire text paragraph to be rectangular.^[ref]

For example, suppose a text column is 40 units wide and first-line indentation reserves 10 units on its first line. ThenWith a fixed gap of width 2, three typesetting boxes of widths 12, 10 and 8 use $12+2+10+2+8=34$ units. They exceed the first line's available width, although they fit a later line in the fixed-space model. When typesetting glue can shrink, feasibility must also account for that permitted shrinkage.

Width and line height measure different directions. Changing the font size can alter both the widths of the typesetting boxes and their vertical metrics, so preserving the same column width does not preserve the same breaks.

The x-height is the height of the main lowercase body of a typeface, conventionally associated with the letter “x”. It excludes the extra extent of ascenders and descenders; the cap height describes a different reference. Small optical overshoots mean that not every lowercase outline without an ascender has exactly the same ink height.^[ref]

Write $r$ for the x-height as a fraction of an em. At nominal scale $p$ pixels per em, its ideal scaled height is $rp$ pixels, before grid fitting. Equal font sizes do not force equal $r$, so changing the typeface can alter the apparent lowercase size.

To preserve a target height $h$ while switching to a design with ratio $r_2>0$, choose $p_2=h/r_2$. If the original ratio was $r_1$ at scale $p_1$, this becomesFor a hypothetical switch from $r_1=0.5$ at 16 pixels per em to $r_2=0.4$, the matching scale is 20 pixels per em. Both lowercase bodies then have ideal height 8 pixels. This is the geometry behind metric-based font-size adjustment when a fallback font replaces another.^[ref]