text-overflow

Utilities for controlling how the text of an element overflows.

Examples

Truncating text

Use the truncate utility to prevent text from wrapping and truncate overflowing text with an ellipsis (…) if needed:

Adding an ellipsis

Use the text-ellipsis utility to truncate overflowing text with an ellipsis (…) if needed:

Clipping text

Use the text-clip utility to truncate the text at the limit of the content area:

This is the default browser behavior.

Responsive design