Menu

Multiline truncated text with “show more” button

September 4th, 2019

Now that we’ve got cross-browser support for the line-clamp property, I expect we’ll see a lot more of that around the web. And as we start to see it more in use, it’s worth the reminder that: Truncation is not a content strategy.

We should at least offer a way to read that truncated content, right? Paul Bakaus uses the checkbox hack and some other trickery to add a functional button that does exactly that.

See the Pen truncated text w/ more button (CSS only, with optional JS helper) by Paul Bakaus (@pbakaus) on CodePen.