{{#markdown}}
Usage: **.ta[alignment]**. <br />
Example: **.tac** (centers text within the element).
{{/markdown}}

<table class="table table-text table-hover">
      <thead>
        <tr>
          <th>Value</th>
          <th>Description</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><code class=" language-css">[alignment]</code></td>
          <td>
            <p>The alignment of the text. Values can be:</p>
            <ul class="link-list">
              <li><code class=" language-css">l</code> Left</li>
              <li><code class=" language-css">r</code> Right</li>
              <li><code class=" language-css">c</code> Center</li>
              <li><code class=" language-css">j</code> Justify</li>
              <li><code class=" language-css">i</code> Inherit</li>
            </ul>
          </td>
        </tr>
        <tr>
          <td><code class=" language-css">.hyph</code></td>
          <td>This class activates hyphenation on paragraphs for example, or on a generic container. This is a progressive enhancement, it is now supported by Firefox, IE10, and Safari. The browser must know the language, for example with <code class=" language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>html</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>en<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span></code> for a proper hyphenation.</td>
        </tr>
      </tbody>
    </table>

<div class="code-content">
{{> toggle-code}}
{{#markdown}}
```html
<!-- The id attribute describes the class value-->
<div id="text-align-center" class="tac"> ... </div>
<div id="text-align-left" class="tal"> ... </div>
<div id="text-align-justify" class="taj"> ... </div>
```
{{/markdown}}

{{> copy-code}}
</div>