Sometimes, we want to align text to the left and text to the right in the same line with CSS.
In this article, we’ll look at how to align text to the left and text to the right in the same line with CSS.
How to align text to the left and text to the right in the same line with CSS?
To align text to the left and text to the right in the same line with CSS, we use flexbox.
For instance, we write
<p>
<span>This text is left aligned</span>
<span>This text is right aligned</span>
</p>
to add some elements.
Then we write
p {
display: flex;
justify-content: space-between;
}
to make the p element a flex container with display: flex;.
Then we use justify-content: space-between; to spread the spans around the p element.
Conclusion
To align text to the left and text to the right in the same line with CSS, we use flexbox.
