2

The CSS 3 Font Matching Algorithm states

4. a. ‘font-stretch’ is tried first. If the matching set contains faces with width values matching the ‘font-stretch’ value, faces with other width values are removed from the matching set. If there is no face that exactly matches the width value the nearest width is used instead. If the value of ‘font-stretch’ is ‘normal’ or one of the condensed values, narrower width values are checked first, then wider values. If the value of ‘font-stretch’ is one of the expanded values, wider values are checked first, followed by narrower values. Once the closest matching width has been determined by this process, faces with other widths are removed from the matching set.

How do you interpret the spec's ordering combined with "closest matching width"?

Say that the available widths are

  • semi-expanded (112.5%)
  • ultra-expanded (200%)

If the page requests font-stretch: expanded (125%), the spec says to look at wider values first, then narrower values. So would the selected width end up being ultra-expanded because it's wider than expanded, or semi-expanded because it's closer to expanded?

Or, to take a more extreme case, if the two available widths are

  • ultra-condensed (50%)
  • semi-expanded (112.5%)

and font-stretch: normal (100%) is requested, which would the algorithm select?

kpozin
  • 25,691
  • 19
  • 57
  • 76

1 Answers1

1

From 3.3. Font width: the font-stretch property

When a face does not exist for a given width, normal or condensed values map to a narrower face, otherwise a wider face. Conversely, expanded values map to a wider face, otherwise a narrower face.

The only interpretation of the algorithm which is consistent with that statement is:

For the first case: "the nearest wider face if any, otherwise the nearest narrower face."
i.e. ultra-expanded

For the second case: "the nearest narrower face if any, otherwise the nearest wider face."
i.e. ultra-condensed

Alohci
  • 78,296
  • 16
  • 112
  • 156