I have come across a question in community pool and felt like answering it here will help more people

Qn: how do you get 2 pics side by side without getting text in the middle?

by Toumaranke


Ans: When the text appear between two images that means those images are floating in opposite direction. In simple language I can say they are aligned opposite each other, one left and the other right.

When you type after the second image the text appears on the left of the image (second one) which forces it to appear in the middle since on the far left there is another image aligned left. You can see it here below

Page viewsUnique VisitorsNow this should not be at the center. I want it to be after the image on the right.

Do you get the concept now? This is what is troubling our fellow blogger.

To avoid that we add some CSS styling to remove the floating effect which forces the text to appear that way.

Write the text that comes after the image in your html editor (not visual) like this

CSS stylingOR

CSS

I have used different tags where p is for a simple paragraph and div is a container where you can put different elements (more things,heading, paragraph etc.). The highlighted text style="clear:both;" is the CSS code that clears the floating effect. The result for my case will be the same as seen below
leftright

now this should not be at the center. I want it to be after the image on the right

Now I can continue.

I hope I my explanation is clear enough, happy blogging!

Advertisements