@@include("../partials/head.html")
@@include("../partials/doc-navbar.html")
@@include("../partials/doc-sidenav.html")

# Text truncation

Truncate long strings of 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`.

This text is quite long, and will be truncated once displayed.
This text is quite long, and will be truncated once displayed.

    <!-- text truncation-->
                            <!-- 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>

@@include("../partials/buy-template.html") @@include("../partials/scripts.html")