CSS line clamp

Posted on March 8, 2020

Today I've discovered this little CSS gem that allows very easily to truncate a paragraph with ellipsis according with the desired number of lines.

It's unofficial but well supported, thus, use it wisely.

The relevan part are in this code:

<p>
  Some text
</p>
p{
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

A reactive demo here