DEV Community 👩‍💻👨‍💻

Orestis Pantazos
Orestis Pantazos

Posted on • Updated on

🏷️ Truncate String with Ellipsis in CSS

The front-end developers sometimes need to redesign the screen in order to truncate string with ellipsis in CSS technology. The best possible solution is the following:

.truncate-format {
  width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
Enter fullscreen mode Exit fullscreen mode

Top comments (1)

Collapse
 
kvuluong profile image
kvu-luong

I think, it only the best possible solution in case single line, not for multiple lines :))
Something like this one:
"abc
xyz..."

16 Libraries You Should Know as a React Developer

>> Check out this classic DEV post <<