CSS line clamp

• 1 min read

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