CSS TEXT ALIGN
In CSS, the text-align property is used to set the horizontal alignment of the text. A text can be aligned in four ways:
- Aligned to the Right
- Aligned to the Left
- Aligned to Center
- Justify
Let's look at few examples to see how these properties work:
Align Center
text-align:center will align all the <p> tags text to the center.
p {
text-align: center;
}
Align Left
text-align:left will align all the <p> tags text to the left.
p {
text-align: left;
}
Align Right
text-align:right will align all the <p> tags text to the right.
p {
text-align: right;
}
Justify
text-align:justify will justify the text of all the <p> tags.
p {
text-align: justify;
}
This is how the alignment works!
text-align:left
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sed libero tortor. Mauris sit amet elementum libero. Proin in placerat dolor. Nullam non mi id metus sagittis aliquet id ac arcu. Suspendisse ac sodales arcu. Sed eget hendrerit nunc. Nam quis scelerisque dui, nec maximus mi.
text-align:right
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sed libero tortor. Mauris sit amet elementum libero. Proin in placerat dolor. Nullam non mi id metus sagittis aliquet id ac arcu. Suspendisse ac sodales arcu. Sed eget hendrerit nunc. Nam quis scelerisque dui, nec maximus mi.
text-align:center
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sed libero tortor. Mauris sit amet elementum libero. Proin in placerat dolor. Nullam non mi id metus sagittis aliquet id ac arcu. Suspendisse ac sodales arcu. Sed eget hendrerit nunc. Nam quis scelerisque dui, nec maximus mi.
text-align:justify
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sed libero tortor. Mauris sit amet elementum libero. Proin in placerat dolor. Nullam non mi id metus sagittis aliquet id ac arcu. Suspendisse ac sodales arcu. Sed eget hendrerit nunc. Nam quis scelerisque dui, nec maximus mi.