Re: Request for adjustable font-size: line-fit

On 21.08.2013, at 07:33, Richard Fink <rfink@readableweb.com> wrote:

> On 8/20/2013 3:18 PM, Sylvain Galineau wrote:
>> The issue Lea is referring to - I think - is that if the element has
>> width:30em, the em in that length refers to the font size of the element
>> the width property applies to. Thus if said font-size is in turn a
>> function of how wide the element is you have a circularity. And in CSS,
>> circularity is awkward.
> 
> I do "get" the problem. It's a Catch-22: if the width of the column is set in ems, as the font gets bigger so does the pixel to em ratio which makes the column bigger, thereby defeating the purpose because the width is inherently set to expand with the font size.
> 
> What I was pointing out is simply that there IS an initial pixel width computed by the rendering engine that corresponds to the font size and em value specified and it's that initial width that needs to remain unchanged - as if it was set using px - for the technique to work.
> But severing the connection between font size and column width when using ems to set the column width immediately after the initial width is calculated, IS a bit of a mind-bender. Circular, yes. And awkward, yes. Don't like it at all.
> But how else can the technique work without preserving that initial width no matter what measure is used - percent, px, en, em, ex, or whatever - and making the width of the line stick to that initial computed style width no matter what the font size changes to and what measure was used in the style sheet?
> Don't know. And I'm not even sure what problem line-fit solves. Hah!
> All I know is that I was deeply intrigued by the technique when I saw it implemented using JavaScript.
> It *feels* like there's something worth pursuing in it even if I'm not quite sure what yet.
> (If anybody has a use case that demonstrates line fit's effectiveness, please share.)

It simply helps achieving nice typographic results on websites (examples and description: http://www.zachleat.com/web/bigtext-makes-text-big/).
Achieving such results in a responsive webdesign by hand is nearly impossible and the jQuery way has several caveats (size, performance).