How can I align text within the same line?

Question

I am simply trying to put some text on the left, center, and right but on the same line. My alignment seemed correct on the first try but each text was on a new line (from left to right). After I tinkered with the code a little it's now entirely messed up.

Part of the code:

<p align="left"> <b>Random Text on the left</b> </p
<p align="center"> <b>Random Text in the middle</b> </p>
<p align="right"> <b>Random Text on the right</b> </p>

I'm currently on Attributes of HTML course and was wondering if I am skipping ahead. Perhaps this might be a topic covered later on?

Answer 1

It can't be done because paragraph element by nature is a block level element so three p tags will start text each on a newline.
Even if you use inline span tag it does not work. because text can either be left/right/center aligned at a time, not all at once! Though they can be on different lines like you did here.

Answer 2

but you can get this done with css like this!
p{
display: inline-block;
width: 33.33%;
text-align: center;
box-sizing: border-box;
float: left;
}

Eg: https://code.sololearn.com/W14q1ww0ooO3/?ref=app

Answer 3

You can also do this with a table. 1 row and 3 columns will create 3 cells that you can align your text in. You can always set the border of the table to 0 if you don't want it visible.