How can I break a line which is over-flowing using HTML or CSS?

Well, to get rid of a line which is overflowing, we can use

overflow:hidden

Code (markup):

but how can we get "FULL-STOP" effect at the end of the line as shown in the below screenshot?

http://i964.photobucket.com/albums/ae123/DollarFriend/well.png

Such that it should look like this...

Thanks

 

You can do this with CSS3 and text-overflow: (can't link, im a newb)

eg: text-overflow: ellipsis;

 

Exactly this is what I'm looking for, but

text-overflow: ellipsis; 

Code (markup):

doesn't seems to be a CSS property.

Edit: It doesn't work

 

It's a CSS3 property I think. But I think this is done with a server-side language like PHP.
This site can help you: phpcode.mypapit.net/truncate-a-very-long-text-with-php-function/33