Pure CSS ellipse for three or more lines of text

Question

Is there a way only for CSS (without JavaScript / jQuery) to show only the first two lines and, if there are three or more lines, hide extra lines and show ellipses?

For example, how can I take this script:

http://jsfiddle.net/0yyr3e63/

... and do it like that?

Lorem Ipsum Dolor
Sit Amet Consectetur

Ut Enim Ad Minim
Veniam Quis Nostrud...

Duis Aute Irure
Dolor In...

Thanks in advance.

Answer 1

You can use property text-overflow:ellipsisc height.

Like this

.truncate 
{
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height:100px;
}

Using text overflow, you can display your output without using javascript.

Sources

Source Link

To learn more about truncation. Read this link

New update

.

css
.classname:after{
content: "\02026";
} 

Multiline-Ellipsis

, , ,

1.Codepen

2.Css Tricks