The community members are discussing how to make text display with ellipsis when it exceeds the available space. One community member suggests using text-wrap: nowrap, text-overflow: ellipsis, and overflow: hidden. Another community member expands on this, suggesting that the solution could be turned into a reusable token to avoid having to look it up each time. A third community member provides a more flexible solution using display: -webkit-box, -webkit-box-orient: vertical, -webkit-line-clamp: 1, overflow: hidden, and text-overflow: ellipsis.
@Santosh , to expand on @Bogdan 's suggestion... you could turn that into a token so you don't have to look it up each time. I've written those few lines hunreds of times and still forget.
It’s more flexible than text-overflow: ellipsis with nowrap and works well for multi-line text. display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
