[css-fonts-4] Better example needed for font-size-adjust

[svgeesus]

The example for font-size-adjust is basically a hack explaining how to iteratively determine a vaue for a given font.

It would be better replaced with an example that shows the nice result when the property is correctly applied.

[matthew-dean]

That whole section is utterly confusing.

Figure 11: Text with and without the use of font-size-adjust

The use of font-size-adjust how???

p {
  font-family: Verdana, Futura, Times;
  font-size-adjust: ??? 
}

[svgeesus]

A good example would have two rules, setting different elements in two different font faces, which have very different x-heights. It would then use font-size-adjust to make the x-heights more similar.

[tigt]

I made an example of this property at https://codepen.io/tigt/pen/MaeJEK

It’s not quite perfect for your needs, as it also uses SVG’s textLength, but I figured it might be useful as an organic “in the wild” example from a web dev.

[svgeesus]

Hmm, this is a bit hand-wavy, too:

This value applies to any font that is selected but in typical usage it should be based on the aspect value of the first font in the font-family list.

What does "any font that is selected" mean? The same wording was in CSS Fonts 3.

[svgeesus]

I put the old example from Fonts 3 into a codepen, calculated the x-height for Verdana and for Times New Roman, then used those values in the earlier example to make it clearer.

[svgeesus]

@matthew-dean the first example now reads

p {
	font-family: Verdana, Futura, Times;
}
p.adj {
	font-size-adjust: 0.545;
}

<p>Lorem ipsum dolor sit amet, ...</p>
<p class="adj">Lorem ipsum dolor sit amet, ...</p>

[dberlow]

From www.w3.org/TR/css-fonts-4/#font-size-adjust-prop ..."This is commonly referred to as the aspect value and is equal to the x-height of a font divided by the font size."

Besides never having heard this term, "aspect value", I believe strongly that the documentation is incorrect. The scale value to match x-heights across fonts is determined by creating a ratio of the x-ht (in units per em) to units per em, to reach the fallback scale value between two such values.

The "font size", as I understand the term is not used.