Recently in our project we’ve had an issue that involved multiline text wrapping. It’s always been a bit shaddy to do it. Some people use character count and then chop the string, some others just rely on the height and so on.

The inexistence of a overall accepted answer worries me a little bit, given that it is not so uncommon. I understand that, with the mobile invasion of the market, mobile first and changing the website to show contents according to which platform you are using makes total sense, and wrapping with ellipsis shouldn’t be the solution.

Hiding content from the users is never the solution, showing a bit and tell them “Ah! Ah! you can’t see more!!” is even worse! Nevertheless, in this specific scenario, wrapping with ellipsis is accepted provided that we can have multiple line.

Luckily for us, we are developing solely for google chrome, and we have webkit available, so here is the solution we’ve adopted.

• Gist
• jsFiddle

Enjoy