[css-fonts-5] Define behavior for <meta text-scale> from #12380 #13052

davidsgrogan · 2025-11-02T17:27:53Z

Initial definition of <meta name="text-scale" content="..."> resolved on in #12380

davidsgrogan · 2025-11-02T17:31:31Z

Hi @JoshTumath , this is my fork of Keith's initial PR. I left the definition of env(preferred-text-scale) in css-env-1 and just referred to it from here. Even though this PR is not fully complete (I didn't mention media queries, for example), I'm hoping to get it in as a kind of MVP spec. Let me know if you think something major is missing and definitely let me know if something is not correct.

fantasai

Also, in general, please follow https://rhodesmill.org/brandon/2012/one-sentence-per-line/ :)

css-fonts-5/Overview.bs

fantasai · 2025-11-05T20:56:05Z

css-fonts-5/Overview.bs

+A document with a <code>&lt;meta></code> tag whose <code>name</code> attribute
+is a <a>ASCII case-insensitive</a> match for
+<dfn lt=text-scale><code>"text-scale"</code></dfn> is recognized as setting the
+initial font size of the document. The value of the <code>content</code>


We're not setting the initial font size. We're setting the computed value of the medium font-size, and scaling all the other absolute size keywords accordingly.

fantasai · 2025-11-05T20:56:49Z

css-fonts-5/Overview.bs

+is a <a>ASCII case-insensitive</a> match for
+<dfn lt=text-scale><code>"text-scale"</code></dfn> is recognized as setting the
+initial font size of the document. The value of the <code>content</code>
+attribute must be an <a>ASCII case-insensitive</a> match for one of the


Must -> otherwise what?

Added 'Otherwise the tag is ignored.'

I'm wondering specifying the 'otherwise' case is neccessary here, because, to me, the HTML spec seems to imply it is ignored anyway.

fantasai · 2025-11-05T20:58:15Z

css-fonts-5/Overview.bs

+The recognized keywords in the [=text-scale=]
+<code class=html>&lt;meta&gt;</code> element are:
+
+<ul>
+	<li><code class="index" lt="legacy!!text-scale-meta">legacy</code></li>
+	<li><code class="index" lt="scale!!text-scale-meta">scale</code></li>
+</ul>


I think it would be better to follow the DL format that we have for property values: list them in the DT with a DFN tag, and give them a definition that's understandable to authors wrt what they do.

Gave it a try. Let me know if you meant something different.

fantasai · 2025-11-05T20:58:57Z

css-fonts-5/Overview.bs

+recognized in the [=text-scale=] content attribute value.
+
+When the value of the [=text-scale=] content attribute is
+<a for="text-scale">legacy</a> the user agent should set the initial font size


should or must? If not must, under what conditions is it reasonable to ignore the should?

Changed to must.

css-fonts-5/Overview.bs

davidsgrogan · 2025-11-05T23:07:12Z

Also, in general, please follow https://rhodesmill.org/brandon/2012/one-sentence-per-line/ :)

Thanks for pointing that out.

JoshTumath

Hi @JoshTumath , this is my fork of Keith's initial PR. I left the definition of env(preferred-text-scale) in css-env-1 and just referred to it from here. Even though this PR is not fully complete (I didn't mention media queries, for example), I'm hoping to get it in as a kind of MVP spec. Let me know if you think something major is missing and definitely let me know if something is not correct.

This looks great! As far as I can tell, it covers everything in the Explainer.

Should the font-size section of the spec also redefine the absolute size keywords in relation to the meta tag/env var?

Once this is merged, we'll need to add the meta extension to this WHATWG wiki page: https://wiki.whatwg.org/wiki/MetaExtensions

css-fonts-5/Overview.bs

JoshTumath · 2025-11-07T16:26:48Z

css-fonts-5/Overview.bs

 Do not assume that if something is not here, it has been dropped.

+<h2 id="text-scale-meta">
+Text-Scale <code class=html>&lt;meta&gt;</code> element</h2>


I noticed the HTML spec also mentions when a metadata name should not appear more than once in the document. Maybe you should add this line somewhere:

There must not be more than one meta element with its name attribute value set to an ASCII case-insensitive match for text-scale per document.

JoshTumath · 2025-11-07T16:32:00Z

css-fonts-5/Overview.bs

+is a <a>ASCII case-insensitive</a> match for
+<dfn lt=text-scale><code>"text-scale"</code></dfn> is recognized as setting the
+initial font size of the document. The value of the <code>content</code>
+attribute must be an <a>ASCII case-insensitive</a> match for one of the


I'm wondering specifying the 'otherwise' case is neccessary here, because, to me, the HTML spec seems to imply it is ignored anyway.

JoshTumath · 2025-11-07T16:32:46Z

css-fonts-5/Overview.bs

+
+Documents without this <code>&lt;meta></code> tag will have an assumed default
+value of <code>legacy</code>.
+


It would be good to add an example block here, similar to the example in the HTML spec for the color-scheme meta tag.

css-fonts-5/Overview.bs

JoshTumath · 2025-11-07T16:40:03Z

css-fonts-5/Overview.bs

+to 16px multiplied by
+the font scale factor
+the user has chosen from any settings <i>provided by the user agent</i>.
+The ''preferred-text-scale'' value must be 1 on desktop platforms.


Wherever you reference the preferred-text-scale env(), maybe it should be prefixed with 'environment variable' in the prose. Since this is not the css-env spec, it's not clear that you're referencing an env().

Bikeshed linkifies ''preferred-text-scale'' to https://drafts.csswg.org/css-env-1/#valdef-env-preferred-text-scale. Do you think that's sufficient? (I couldn't tell if you already knew the linkification part)

css-fonts-5/Overview.bs

JoshTumath · 2025-11-07T16:48:39Z

css-fonts-5/Overview.bs

+<a for=text-scale>scale</a>, the user agent should skip all font-sizing interventions it would otherwise perform in an attempt to automatically honor the user's preferences. E.g. text autosizing on mobile (See [[css-size-adjust#intro]]) and full-application zoom (<a href="https://github.com/w3c/csswg-drafts/blob/main/css-env-1/explainers/env-preferred-text-scale.md#windows-11">popular browsers do this on Windows)</a>.

+Note: It is expected that authors will use
+''&lt;meta name="text-scale" content="scale"&gt;'' in stylesheets so that the initial font size will reflect a combination of the user's font preferences, whether those are specified at the OS level or the UA level. The author will then be able to use ''rem'' throughout the page to honor the user's font preferences.


Maybe the sentence about using rem is actually better explained in an example block.

So you could keep the Note block to explain how authors are expected to use scale in their documents, with the example block below it to explain how, if you set scale and don't alter the default font size, content sized with rem units will be relative to the preferred text scale.

Also, I'm not sure if the Note should actually be an orange Assertion box. But maybe not because assertions are normative? Where I've seen Assertion boxes in the past are places like the css-flexbox spec, where it tells authors to use the flex shorthand rather than the longhands.

Yeah, Advisement (you meant "advisement", not "assertion". I think :) boxes are supposed to be normative. This Note seems merely descriptive as is now, but I suppose we can strengthen the language to say that authors must use it to obey the user's font preferences. Oh, though, we kind of don't care if authors use the more difficult env(..) instead to honor the user's preferences. So maybe we leave it non-normative?

So you could keep the Note block to explain how authors are expected to use scale in their documents, with the example block below it to explain how, if you set scale and don't alter the default font size, content sized with rem units will be relative to the preferred text scale.

I'd like to think we included a good example in the explainer we can crib from.
... and we didn't.

Yeah, an example would be good here.

Co-authored-by: Josh Tumath <[email protected]>

- Sentence about >1 meta tag - s/medium/initial/g - earlier example

no bs edits

8d5f5e2

davidsgrogan marked this pull request as ready for review November 2, 2025 17:29

davidsgrogan requested a review from JoshTumath November 2, 2025 17:29

Small revisions

18f2f8b

fantasai requested changes Nov 5, 2025

View reviewed changes

after review round 1

b729d74

davidsgrogan requested a review from fantasai November 5, 2025 23:07

JoshTumath reviewed Nov 7, 2025

View reviewed changes

Apply suggestions from code review

0206973

Co-authored-by: Josh Tumath <[email protected]>

svgeesus added the css-fonts-5 label Nov 10, 2025

Josh's suggestions from review round 1

c287984

- Sentence about >1 meta tag - s/medium/initial/g - earlier example


		Documents without this <code><meta></code> tag will have an assumed default
		value of <code>legacy</code>.

[css-fonts-5] Define behavior for <meta text-scale> from #12380 #13052

Are you sure you want to change the base?

[css-fonts-5] Define behavior for <meta text-scale> from #12380 #13052

Conversation

davidsgrogan commented Nov 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

davidsgrogan commented Nov 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

fantasai left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

davidsgrogan commented Nov 5, 2025

Uh oh!

JoshTumath left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

davidsgrogan commented Nov 2, 2025 •

edited

Loading

davidsgrogan commented Nov 2, 2025 •

edited

Loading