diff options
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/4.0/utilities/text.md | 8 |
1 files changed, 7 insertions, 1 deletions
diff --git a/docs/4.0/utilities/text.md b/docs/4.0/utilities/text.md index 32e11335d..8dcbba078 100644 --- a/docs/4.0/utilities/text.md +++ b/docs/4.0/utilities/text.md @@ -42,14 +42,20 @@ Prevent text from wrapping with a `.text-nowrap` class. </div> {% endexample %} -For longer content, you can add a `.text-truncate` class to truncate the text with an ellipsis. +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 html %} +<!-- Block level --> <div class="row"> <div class="col-2 text-truncate"> Praeterea iter est quasdam res quas ex communi. </div> </div> + +<!-- Inline level --> +<span class="d-inline-block text-truncate" style="max-width: 150px;"> + Praeterea iter est quasdam res quas ex communi. +</span> {% endexample %} ## Text transform |