Classical approach
.clamp {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
[data-clamp-lines] {
display: -webkit-box;
-webkit-line-clamp: attr(data-clamp-lines number, 2);
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
In Tailwind there is a handy class for it
<a class="line-clamp-<number>" href="..."></a>
Top comments (0)