Re: [csswg-drafts] [css-fonts-4] Feature for making text always fit the width of its parent (#2528)

I published a small update in the article: https://kizu.dev/fit-to-width/#accounting-for-optical-sizing — in short, my technique in its previous form did not work for variable fonts with an optical sizing axis.

However, it was not too difficult to fix. For this case, all we need is introduce another step: when we render things for the first time, instead of applying the font-size, we apply it only as a `opsz` value, and then repeat it again. The applied `opsz` won't be 100% correct, but is good enough, not straying too far from the proper one. And this step is only needed for fonts with `opsz` (and could be potentially reused for any other similar cases), so not a perf issue.

- - -

@nathanchase Yes, this could be done with custom elements and shadow DOM, although it might be a bit tricky with the way it works: we could want to keep the text itself in the light DOM, so all the styles will be applied as before, so we'll need to use slots. But also we can't put original text into the slot, and duplicate things into the shadow DOM, as then the styles won't apply evenly: we'd probably need to create extra slots, and then duplicate the content in the light DOM, assigning it to different slots. (and also you'd want to use a `text-fit` custom element name, as they have to contain at least one dash).

-- 
GitHub Notification of comment by kizu
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2528#issuecomment-2241304291 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Saturday, 20 July 2024 21:48:53 UTC