I have two paragraphs, and I am trying to get the second one to


But the paragraph just stays where it is, without floating.
I added <div class="clear"></div> to my html, but that did not help.
Can anyone see what I am doing wrong?
Url is www.accupresh.com

Thank you!

4 Years
Discussion Span
Last Post by gon1387

Can you provide the relevant HTML code. The clear:both style is generally used after the floats so that you ensure that the content you are applything this to is "clearing" both the left and right float.


Clear both clears the float on both sides. Clear left clears the float on the left, and clear right the float on the right.

Paragraphs are block elements. In order to place to paragraphs next to each other, you have to float both paragraphs.

<p style="float: left;">The left paragraph</p>
<p style="float: left;">The right paragraph</p>

You may want to define a width for each paragraph, as the float command converts them into inline elements. Besides any inline element after the second paragraph will be placed on the right of the second paragraph, if there is still space.

I would recommend the following solution:

<div style="display: table; width: 100%">
    <div style="float: left; width: 50%">
        <p>The left paragraph</p>
    <div style="float: left; width: 50%">
        <p>The right paragraph</p>

Now you can fill the first table with a background color which is visible although the element is containing float elements.


No more, no less. @Baradaran's right.

by the way, just a clarification of what you want. Since you mentioned clear: both, by anychance is this(A) what you wanted to do? or (B)?

|[PARAGRAPH 1]             |
|[PARAGRAPH 2]             |
|                          |

|                          |
|                          |

Edited by gon1387

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.