Trim Text with "..." if it is too long

Question

I have a div of certain size. Now whenever data is coming to that div from database, the excess length of the text is coming down as wrap text (like MS Excel). I want it to be in one line and obviously within the div. End the line with "..."

Can anyone help me to do so using css.

Thanks in advance

Answer 1

You can use this:

text-overflow: ellipsis;

It will render '...' if it is too long.

Reference: http://www.w3schools.com/cssref/css3_pr_text-overflow.asp

Edit: Thanks to AndyM's comment, you can also use white-space:nowrap to handle white spaces overflow:hidden to prevent text overflow.