How to track lines count when words are wrapped?

Question

Have a text to output in div printed with not fixed-pitch font. This div height permit to print only 4 lines of text. Is it possible to track automatic browser word wrap, so I can find position in text, when it has reached 4 lines and to cut away next lines? Any suggestions using Javascript manipulating with DOM or maybe text line length calculation with PHP help?

Answer 1

How about using overflow: hidden?

Say you had a font-size of 12px, and a line-height of 16px.

4 lines * 16px = 64px

.hide-extra-lines {
    height: 64px;
    overflow: hidden;
}

Is this what you're after?

Answer 2

1) You can measure the size of the text on the server and be reasonably accurate. I've done this with GDI+ on a Windows machine; not sure what OS or libraries you have access to.

2) You can use a monospace font on the client and detect when text will wrap based on width of the container and word length. Then, you can truncate the text.

3) You can not use a monospace font on the client, still make a guess using script, and use overflow: hidden to capture any text that overflows.