Débordement de texte ellipse sur deux lignes

Question

Je sais que vous pouvez utiliser une combinaison de règles CSS pour faire en sorte que le texte se termine par une ellipse (...) lorsqu'il est temps de déborder (sortir des limites du parent).

Est-il possible (n'hésitez pas à dire non) d'obtenir le même effet, mais en laissant le texte s'enrouler sur plus d'une ligne ?

Voici une démo .

div {
  width: 300px; 
  height: 42px; 
  overflow: hidden; 
  text-overflow: ellipsis; 
  white-space: nowrap;
}

Comme vous pouvez le constater, le texte se termine par des ellipses lorsqu'il dépasse la largeur de la division. Cependant, il y a encore assez d'espace pour que le texte s'enroule sur une deuxième ligne et continue. Ceci est interrompu par white-space: nowrap qui est nécessaire pour que l'ellipse fonctionne.

Des idées ?

P.S. : Pas de solutions JS, pure CSS si possible.