[thelist] counting rendered lines of text

[David Kaufman]

Hi Sam,

sbeam <sbeam at syxyz.net> wrote:
> Say you have a container of a fixed width with some text in it. Is
> there any way to count the number of lines in the text, as rendered?
>
> ie.
> <div id="wrapper" style="width: 300px;">
>  Here is a bunch of text that may be short, may be very long, we don't
>  know because it comes from user input.
> </div>
>
> Basically the design requires this fixed-size block for a list of
> preview items, but the request is to only show the first 4 lines, with
> an ellipsis and "more" link if needed. AFAIK this isn't possible, we
> can only count characters and words, right? which given the variation
> in font size and letter width is not reliable...

You mean like the book descriptions I did for the left column of 
http://www.workman.com/?

We had the exact same requirement - these rotate randomly over several 
thousand titles, so we had to come up with an algorithm to figure our 
how many characters (on average) we could fit into 4 lines at that 
column width, that font and that size (minus the "...More" link), and 
clip the strings to that length.  Taking care, of course, not to clip a 
word in half...  It was stupid but it works (most of the time).

I want to make it perfect, of course, but don't have time (yet).  I 
think the perfect solution is to (on the back-end, which is perl) use 
TTF metrics tables to actually KNOW how wide the characters are, predict 
where the text will wrap, and truncate the text at the exact right place 
to make it fit perfectly.

That would be a new holy grail in web design: we already have "Pixel 
Perfect".  this would be "Point Perfect" (or "Print Perfect", since 
"Word Perfect" is trademarked and "Typeset Perfect" just lacks... 
something.)

-dave

PS. Please ignore the clipped-in-half third line of the titles in the 
scroller -- I'm trying to fix that right now.