Display inline two p tag

Question

I want to display two p tags in same line, one left and one right as below :

<p >This is a paragraph.</p>
<p style="text-align : right">This is a paragraph.</p>

In the CSS, I am doing below :

p {display: inline-block;}

But this is not giving me the desired output. Instead its showing both the sentences together like below :

This is a paragraph. This is a paragraph.

Answer 1

Why would you want to do that? <p> stands for "paragraph". If you want two of these in the same line, you should use another tag, such as <span>.

Answer 2

Use float:left on the first p and float:right on the second.

HTML

<div>
   <p class="pull-left">Text in left paragraph</p>
   <p class="pull-right">Text in right paragraph</p>
</div>

CSS

.pull-left {float:left;}
.pull-right {float:right;}

JSFiddle