Skip to content

Add <meta name="text-scale" content="scale"> #12530

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
davidsgrogan wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Add <meta name="text-scale" content="scale"> #12530

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 32 additions & 1 deletion source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3928,6 +3928,8 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute

<ul class="brief">
<li><dfn data-x-href="https://drafts.csswg.org/css-fonts/#first-available-font">first available font</dfn></li>
<li><dfn data-x-href="https://drafts.csswg.org/css-fonts-5/#text-scale">text-scale</dfn></li>
<li><dfn data-x-href="https://drafts.csswg.org/css-fonts-5/#text-scale-meta-keywords">text-scale keywords</dfn></li>

@domfarolino domfarolino Jun 15, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll be the first to admit I really don't understand how CSS "levels" work or why they exist. But I will note that these links all have css-fonts-5 in them instead of css-fonts, so any reference to <ref>CSSFONTS</ref> will not go to Level 5 specification, but will instead appear to go to Level 4. What does this mean in practice?

<li>The <dfn data-x-href="https://drafts.csswg.org/css-fonts/#font-family-prop">'font-family'</dfn> property</li>
<li>The <dfn data-x-href="https://drafts.csswg.org/css-fonts/#font-weight-prop">'font-weight'</dfn> property</li>
<li>The <dfn data-x-href="https://drafts.csswg.org/css-fonts/#font-size-prop">'font-size'</dfn> property</li>
Expand Down Expand Up @@ -18283,8 +18285,37 @@ interface <dfn interface>HTMLMetaElement</dfn> : <span>HTMLElement</span> {
how CSS fallback works for properties, the multiple meta elements needs to be arranged with the
legacy values after the newer values.</p>
</dd>
</dl>

<dt><dfn attr-value for="meta/name"><code data-x="meta-text-scale">text-scale</code></dfn></dt>

<dd>
<p>The value must be a string that matches one of the <span>text-scale keywords</span> defined for the
<span>text-scale</span> metadata name in the CSS Fonts specification.</p>

@domfarolino domfarolino Jun 15, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would change both of these lines above to:

    <p>The value must be a string that matches one of the <span>text-scale keywords</span> <ref>CSSFONTS</ref>.</p>

If we make this change, then maybe we can remove the link to text-scale in CSS?


<p>There must not be more than one <code>meta</code> element with its <code

@domfarolino domfarolino Jun 15, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can run specfmt on this and it should rewrap it properly to maximize the number of characters per line up to 100, or you can do that manually.

data-x="attr-meta-name">name</code> attribute value set to an
<span>ASCII case-insensitive</span> match for <code
data-x="meta-text-scale">text-scale</code> per document.</p>

@domfarolino domfarolino Jun 15, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This requirement is duplicated from https://drafts.csswg.org/css-fonts-5/#ref-for-text-scale:~:text=There%20must%20not%20be%20more%20than%20one%20meta%20element%20with%20its%20name%20attribute%20value%20set%20to%20an%20ASCII%20case%2Dinsensitive%20match%20for%20text%2Dscale%20per%20document.

How are we deciding what to port over from CSS here, what to keep their, and what to duplicate? It would be great to have as much of it as we can here, and have CSS just link to that.


<div class="example">
<p>The following declaration indicates that the page is aware of and can handle the user's
text scaling preferences:</p>

<pre><code class="html">&lt;meta name="text-scale" content="scale"></code></pre>
</div>

<div w-nodev>

<p>If any <code>meta</code> elements are <span data-x="node is inserted into a
document">inserted into the document</span> or <span data-x="node is removed from a
document">removed from the document</span>, or existing <code>meta</code> elements have their
<code data-x="attr-meta-name">name</code> or <code data-x="attr-meta-content">content</code>
attributes changed, user agents must process the <code>meta</code> element's state as defined
in CSS Fonts.</p>

@domfarolino domfarolino Jun 15, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there an algorithm to point to at all, or a section that describes this that we can link to?


</div>
</dd>
</dl>


<h5>Other metadata names</h5>
Expand Down
Loading