This is an example of the picture at the URL "lindorfer.us/wizard/Graphics/Me.jpg" displayed in different places.

This picture is left aligned. The paragraph before the image is treated as the client would normally format it. But the alignment of the image tells the client to display it on the left side of the paragraph. The text wraps around the left aligned image to make it look like we actually wanted, that is the picture to the left and the text on the right. The text will continue to wrap around the right side of a left-aligned image until it ends, or until it gets to the bottom of the image, and then it will continue to wrap over to the left margin of the document, as it usually does.

We can put the image on the right and let the text wrap around it on the left by inserting the image this way. The image on the right is aligned right. In this case the image shows up on the right of the text which follows in the same paragraph.

One can also align top and align bottom, but I prefer to use the "align" attribute for left and right alignment and format the rest of the document with paragraph marks as one would if you were pasting the picture into an existing document, such as a newspaper, where a picture is associated with a specific paragraph

Click here to see an example of a document with horizontal and vertical spaces between the images and the text.

Click here to go back to the Third Grade HTML text that follows this example