The line-clamp property
The left property limits text to a
specified number of lines. Instead of extra
lines in the text, an ellipsis is placed.
Syntax
selector {
line-clamp: none | number of lines
}
Example
Let's limit our text to two lines:
<p>
text text text text text text text text
text text text text text text text text
text text text text text text text text
text text text text text text text text
</p>
body {
width: 200px;
height: 100px;
}
p {
-webkit-line-clamp: 2;
line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
:
