CSS FLoat Right

Using CSS Inline Style

Float Image and Text Caption Right

Goodrich Wins

There is one difference between the Float Image Left code and this float. We added padding-left to the paragraph that floats to the right so that the text and the image have more space between them.

We are floating the picture to the right by adding style float:right to the paragraph tag . We need to tell the browser how wide to make the paragraph that will contain the image and the text caption on the right. Since our image is 100 pixels wide we guess and make the paragraph 125 pixels wide so that we have some extra space.

The text that we are typing in after the first paragraph will automatically align to the left. This technique is simple, just some style added to the paragraph tag. We added extra words here so that the full effect displays.

Copy and paste (or type) this in your Blog or Web page.

It will look like this (image included).

Goodrich Wins

YOUR TEXT GOES HERE The text that you type here will automatically align to the left of the image. You can type as much as you want. The more you type the better it looks.