Typography
Text Overflow
Utilities for controlling text overflow in an element.
Basic usage
Truncate
Use truncate to truncate overflowing text with an ellipsis (…) if needed.
The longest word in any of the major English language dictionaries is pneumonoultramicroscopicsilicovolcanoconiosis, a word that refers to a lung disease contracted from the inhalation of very fine silica particles, specifically from a volcano; medically, it is the same as silicosis.
<p className="**truncate** ...">...</p>
Ellipsis
Use text-ellipsis to truncate overflowing text with an ellipsis (…) if needed.
The longest word in any of the major English language dictionaries is pneumonoultramicroscopicsilicovolcanoconiosis, a word that refers to a lung disease contracted from the inhalation of very fine silica particles, specifically from a volcano; medically, it is the same as silicosis.
<p className="**text-ellipsis** overflow-hidden ...">...</p>
Clip
Use text-clip to truncate the text at the limit of the content area.
The longest word in any of the major English language dictionaries is pneumonoultramicroscopicsilicovolcanoconiosis, a word that refers to a lung disease contracted from the inhalation of very fine silica particles, specifically from a volcano; medically, it is the same as silicosis.
<p className="**text-clip** overflow-hidden ...">...</p>