This card title is intentionally very long to demonstrate the truncate utility. It should be cut off with an ellipsis.
This is a very, very long title for a card item that absolutely needs to be truncated because it is way too lengthy to fit.
The text inside the blue box above uses the
truncate
class.
Imagine a table where descriptions need to be kept concise.
| Item ID | Description | Status |
|---|---|---|
| #12345 |
This is an extremely long description for item #12345. It contains many details that are not necessary for a quick overview in a table, so we will truncate it. |
Active |
| #67890 |
Another very long description, this time for item #67890, also needs truncation to keep the table clean. |
Inactive |
The "Description" column uses
truncate
within a fixed-width div.