The text-overflow CSS property helps us to handle the situation where the content overflowed out of the container. The ideal way is to show ellipsis to signal users that there is more content. But text-overflow alone cannot help to achieve this effect. we should have a combination of CSS properties to get Ellipsis effect.

We should apply a combination of whitespace, overflow and text-overflow properties together to get this done.

It is good to create a CSS class like this

and apply this class, wherever required. for example.