Bootstrap – Text Truncation


Bootstrap – Text truncation



”;


This chapter discusses about the utility provided by Bootstrap that helps in truncating long strings of text. Text truncation is a feature that allows you to truncate long strings of text that overflow their container, and display an ellipsis (…) at the end of the truncated text to indicate that more text is available.

  • This can be useful for situations where you have limited space to display text, such as in a table or card.

  • To truncate text in Bootstrap 5, you can use the .text-truncate class.

  • It requires display: inline-block or display: block.

  • This class can be added to any element that contains text, such as a <div> or a <p> element.

Here”s an example of how to use the .text-truncate class: