Tailwind CSS: Line up text (left, center, right).

Working with Text

Line up text (left, center, right).

Skill ID: WorkingWithText_28

Description: Control if text starts on the left, is centered, or starts on the right.

Where to apply: Headings, paragraphs, image captions.

Key Tailwind Classes:


       text-left


       text-center


       text-right

Gotcha: These utilities align the text within its own block-level container . To center the entire block element on the page, you need mx-auto (see skill 6), not just text-center .

Tailwind CSS Concept Explained

Working with Text

Line up text (left, center, right).

Example 1:

Example 2:

Example 3:

Example 4:

Example 5:

Example 6: