CSS: Text overflow ellipsis on two lines, is it possible?

nilverlobo

New Member
I know you can use a combination of CSS rules to make text end with ellipsis (...) when it's time to overflow (get out of parent's bounds).Is it possible (feel free to just say, no) to achieve the same effect, but let the text wrap on more than one line?Here's a demo.\[code\]div { width: 300px; height: 42px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\[/code\]As you can see, the text ends with ellipsis when it goes wider than the div's width. However, there is still enough space for the text to wrap on a second line and go on. This is interrupted by \[code\]white-space: nowrap\[/code\], which is required for the ellipsis to work.Any ideas?P.S.: No JS solutions, pure CSS if possible.
 
Back
Top