Text Alignment
The text-align property is used to control the horizontal alignment of text inside an HTML element.
Common values include left, center, right, and justify.
How Text Alignment Works
Example 1: Left Alignment
The left value aligns text to the left side of the element.
CSS Code
p {
text-align: left;
}Output
This text is aligned to the left.
Example 2: Center Alignment
The center value places text in the center of the element.
CSS Code
h2 {
text-align: center;
}Output
Center Aligned Heading
Example 3: Right Alignment
The right value aligns text to the right side of the element.
CSS Code
p {
text-align: right;
}Output
This text is aligned to the right.
Example 4: Justify Alignment
The justify value stretches text so that each line has a similar width.
CSS Code
p {
text-align: justify;
}Output
CSS is used to style web pages. The text-align property controls the horizontal alignment of text inside an element.
Common Text Alignment Values
| Value | Description |
|---|---|
left
|
Aligns text to the left |
center
|
Centers the text |
right
|
Aligns text to the right |
justify
|
Stretches text across the available width |
Simple Explanation
text-align: left; → Text moves to the left.
text-align: center; → Text appears in the center.
text-align: right; → Text moves to the right.
text-align: justify; → Text is distributed across the available width.
Summary
The text-align property controls the
horizontal alignment of text. Common values are
left, center,
right, and justify.