<spanclass="form-help"data-toggle="popover"data-placement="top"data-content="<p>ZIP Code must be US or CDN format. You can use an extended ZIP+4 code to determine address more accurately.</p><p class='mb-0'><a href=''>USP ZIP codes lookup tools</a></p>">?</span>
@@ -8,7 +8,7 @@ description: Documentation and examples for common text utilities to control ali
Easily realign text to components with text alignment classes.
{% example html %}
{% example %}
<pclass="text-left">Left aligned text on all viewport sizes.</p>
<pclass="text-center">Center aligned text on all viewport sizes.</p>
<pclass="text-right">Right aligned text on all viewport sizes.</p>
...
...
@@ -19,7 +19,7 @@ Easily realign text to components with text alignment classes.
Transform text in components with text capitalization classes.
{% example html %}
{% example %}
<pclass="text-lowercase">Lowercased text.</p>
<pclass="text-uppercase">Uppercased text.</p>
<pclass="text-capitalize">Capitalized text.</p>
...
...
@@ -29,7 +29,7 @@ Transform text in components with text capitalization classes.
Utilities for controlling the tracking (letter spacing) of an element.
{% example html %}
{% example %}
<pclass="tracking-tight">Lorem ipsum dolor sit amet. Tight letter spacing.</p>
<pclass="tracking-normal">Lorem ipsum dolor sit amet. Normal letter spacing.</p>
<pclass="tracking-wide">Lorem ipsum dolor sit amet. Wide letter spacing.</p>
...
...
@@ -39,18 +39,29 @@ Utilities for controlling the tracking (letter spacing) of an element.
Utilities for controlling the leading (line height) of an element.
{% example html %}
{% example %}
<pclass="leading-none">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
<pclass="leading-tight">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
<pclass="leading-normal">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
<pclass="leading-loose">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
{% endexample %}
## Basic elements
## Antialiasing
Utilities for controlling the font smoothing of an element.
Use the `.antialiased` utility to render text using subpixel antialiasing or use the `.subpixel-antialiased` render without antialiasing.
{% example %}
<divclass="antialiased">Text with antialiasing</div>
<divclass="subpixel-antialiased">Text without antialiasing</div>
{% endexample %}
## Markdown elements
When you can't use the CSS classes you want, or when you just want to directly use HTML tags, use `.markdown` as container. It can handle almost any HTML tag.
{% example html %}
{% example %}
<divclass="markdown">
<h1>Hello World</h1>
<p>Lorem ipsum<sup><a>[1]</a></sup> dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque. Sub<sub>script</sub> works as well!</p>