Articles Tagged
truncation
line-clamp
The line-clamp
property truncates text at a specific number of lines.
The spec for it is currently an Editor’s Draft, so that means nothing here is set in stone because it’s a work in progress. That said, it’s defined as …
Line Clampin’ (Truncating Multiple Line Text)
You want X lines of text. Anything after that, gracefully cut off. That’s “line clamping” and it is a perfectly legit desire. When you can count on text being a certain number of lines, you can create stronger and more …
Truncate String with Ellipsis
All the following are required, so the text must be in a single straight line that overflows a box where that overflow is hidden.
.truncate {
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
See the Pen Basic Overflow …
Need front-end development training?
Frontend Masters is the best place to get it. They have courses on all the most important front-end technologies, from React to CSS, from Vue to D3, and beyond with Node.js and Full Stack.