Is there a way to add three dots at the end of the second line of a text without affecting the first line? I found an example on this jsfiddler for one line, but I'm struggling to make it work with two lines. Any suggestions on how to achieve this?
http://jsfiddle.net/hT3YA/263/
#test {
background:#eee;
border:1px dotted #ccc;
margin:1em;
padding:5px;
width:100px;
height:200px;
}
.crop {
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
width:200px; }
<div id="test" class="crop">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged
</div>