mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-28 15:50:01 +02:00
Release v5.3.0-alpha1 (#37661)
* Bump version to 5.3.0-alpha1 * Dist * Add docs versions updates * Update note in homepage hero Co-authored-by: Mark Otto <markdotto@gmail.com>
This commit is contained in:
23
site/content/docs/5.3/helpers/text-truncation.md
Normal file
23
site/content/docs/5.3/helpers/text-truncation.md
Normal file
@@ -0,0 +1,23 @@
|
||||
---
|
||||
layout: docs
|
||||
title: Text truncation
|
||||
description: Truncate long strings of text with an ellipsis.
|
||||
group: helpers
|
||||
toc: false
|
||||
---
|
||||
|
||||
For longer content, you can add a `.text-truncate` class to truncate the text with an ellipsis. **Requires `display: inline-block` or `display: block`.**
|
||||
|
||||
{{< example >}}
|
||||
<!-- Block level -->
|
||||
<div class="row">
|
||||
<div class="col-2 text-truncate">
|
||||
This text is quite long, and will be truncated once displayed.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Inline level -->
|
||||
<span class="d-inline-block text-truncate" style="max-width: 150px;">
|
||||
This text is quite long, and will be truncated once displayed.
|
||||
</span>
|
||||
{{< /example >}}
|
Reference in New Issue
Block a user