> For the complete documentation index, see [llms.txt](https://codennerd.gitbook.io/cxcss/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://codennerd.gitbook.io/cxcss/product-guides/typography/text-align.md).

# Text Align

#### Text Alignment Classes

**`.text-right`**

Aligns the text to the right.

CSS equivalent: `text-align: right;`

Example usage:

```html
<div class="text-right">This text is aligned to the right.</div>
```

***

**`.text-center`**

Aligns the text to the center.

CSS equivalent: `text-align: center;`

Example usage:

```html
<div class="text-center">This text is aligned to the center.</div>
```

***

**`.text-left`**

Aligns the text to the left.

CSS equivalent: `text-align: left;`

Example usage:

```html
<div class="text-left">This text is aligned to the left.</div>
```

***

#### Text Justification Classes

**`.text-justify-auto`**

Sets the text justification to auto.

CSS equivalent: `text-align: justify;`

Example

usage:

```html
<div class="text-justify-auto">
  <p>This text is justified with the auto justification mode.</p>
</div>
```

***

**`.text-justify-inter-word`**

Sets the text justification to inter-word.

CSS equivalent:

```css
.text-justify-inter-word {
  text-align: justify;
  text-justify: inter-word;
}
```

Example usage:

```html
<div class="text-justify-inter-word">
  <p>This text is justified with the inter-word justification mode.</p>
</div>
```

***

**`.text-justify-inter-ideograph`**

Sets the text justification to inter-ideograph.

CSS equivalent:

```css
.text-justify-inter-ideograph {
  text-align: justify;
  text-justify: inter-ideograph;
}
```

Example usage:

```html
<div class="text-justify-inter-ideograph">
  <p>This text is justified with the inter-ideograph justification mode.</p>
</div>
```

***

**`.text-justify-inter-cluster`**

Sets the text justification to inter-cluster.

CSS equivalent:

```css
.text-justify-inter-cluster {
  text-align: justify;
  text-justify: inter-cluster;
}
```

Example usage:

```html
<div class="text-justify-inter-cluster">
  <p>This text is justified with the inter-cluster justification mode.</p>
</div>
```

***

**`.text-justify-distribute`**

Sets the text justification to distribute.

CSS equivalent:

```css
.text-justify-distribute {
  text-align: justify;
  text-justify: distribute;
}
```

Example usage:

```html
<div class="text-justify-distribute">
  <p>This text is justified with the distribute justification mode.</p>
</div>
```

***

**`.text-justify-kashida`**

Sets the text justification to kashida.

CSS equivalent:

```css
.text-justify-kashida {
  text-align: justify;
  text-justify: kashida;
}
```

Example usage:

```html
<div class="text-justify-kashida">
  <p>This text is justified with the kashida justification mode.</p>
</div>
```

***

**`.text-justify-tibetan`**

Sets the text justification to Tibetan.

CSS equivalent:

```css
.text-justify-tibetan {
  text-align: justify;
  text-justify: auto;
  text-align-last: justify;
}
```

Example usage:

```html
<div class="text-justify-tibetan">
  <p>This text is justified with the Tibetan justification mode.</p>
</div>
```