Truncating text to specifc number of lines after formatting

Question

I am making a site which will display some videos from the YouTube API, and truncates the video description to 170 characters on the server side. They have to go in a narrow box so whenever it contains URLs or long words which make it wrap a lot, it can sometimes overflow out of the container. Is there a client side way to truncate the strings and add an ellipsis on the end (I could use overflow:hidden but I can't use an ellipsis with that. It's my last resort).

Here below is an image of what I'm trying to do:

Answer 1

The only native way to end with ellipsis a multiline text is -webkit-box & -webkit-line-clamp wich has very low support.

div{
 width:150px;
 overflow: hidden;
 text-overflow: ellipsis;
 display: -webkit-box;
 -webkit-line-clamp: 2; /* number of lines to show */
 -webkit-box-orient: vertical;
}

example http://jsfiddle.net/rmy2Y/

else you need to find some css hacks or js scripts.