Multiple line text overflow
I need to trim some text not depending on its length, but on its height. I have this:

    <div style="width:100px; height:100px; overflow:hidden;">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec lacus at felis malesuada hendrerit. Pellentesque et leo venenatis nulla feugiat bibendum. Ut pretium porta massa, vitae interdum nulla ultrices et. Etiam ut erat id magna interdum consequat. Curabitur ornare sodales metus quis egestas. Donec odio est, hendrerit vel vehicula ut, scelerisque ac tortor. Curabitur risus neque, viverra vitae dapibus vitae, vulputate vitae est
    </div>

This code will display a square with overflowing text hidden. I need the overflowing text to be hidden, but at the end of vissible text, there would be ellipsis ("...") displayed.
The problem in use of `text-overflow` property is, that it works only for `world-wrap: none;` - just for one line of text.
Multiple line text overflow
===

I need to trim some text not depending on its length, but on its height. I have this:

    <div style="width:100px; height:100px; overflow:hidden;">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec lacus at felis malesuada hendrerit. Pellentesque et leo venenatis nulla feugiat bibendum. Ut pretium porta massa, vitae interdum nulla ultrices et. Etiam ut erat id magna interdum consequat. Curabitur ornare sodales metus quis egestas. Donec odio est, hendrerit vel vehicula ut, scelerisque ac tortor. Curabitur risus neque, viverra vitae dapibus vitae, vulputate vitae est
    </div>

This code will display a square with overflowing text hidden. I need the overflowing text to be hidden, but at the end of vissible text, there would be ellipsis ("...") displayed.
The problem in use of `text-overflow` property is, that it works only for `world-wrap: none;` - just for one line of text.