Post
At the CSS WG meeting, we're discussing possibly natively doing fit-text in CSS. Send us your use cases (with screenshots/links)!
Do you ever need to fit multi-line text?
Do you ever need to fit non-text inline elements (e.g. icons)?
Do you adjust font-size, letter-spacing, or both?
@leaverou In addition to adjust font-size & letter-spacing, it should be possible to adjust by variable font axes (specifically, font width).
I don't really like it, but SVG text also has the option to stretch/squish glyphs (one-dimensional scale transform). For completeness, a CSS feature should be able to include that (so that the SVG feature can be redefined/re-implemented to use the CSS one).
But either way: author should be able to specify which factors are adjustable & to which degree.
@leaverou I had a project where multi-line text fitting would’ve been great but I had to scrap the idea because a JS solution was out of scope and I couldn’t find any other way.
Specifically, something where the text would be sized to fit a specified number of lines while the inline size of the text’s container changed.
For single line fit-text, I’ve used the registered custom properties hack documented at https://kizu.dev/fit-to-width/, but a non-hacky native solution would be much preferable.
@leaverou Why is the WG discussing a solution before it has a list of problems?
A space for Bonfire maintainers and contributors to communicate
