Property text-overflow

Specifies what should happen when text
overflows the containing element

Sets how hidden overflow content is signaled to
users. It can be clipped, display an ellipsis (’…’),
or display a custom string.

The text-overflow property only affects content
that is overflowing a block container element in
its inline progression direction (not text
overflowing at the bottom of a box, for example).

Formal syntax

text-overflow = 
  clip      |
  ellipsis

Syntax

text-overflow: clip;
text-overflow: ellipsis ellipsis;
text-overflow: ellipsis " [..]";

/* Global values */
text-overflow: inherit;
text-overflow: initial;
text-overflow: revert;
text-overflow: revert-layer;
text-overflow: unset;