[Don’t forget to use the alt tag — <img src=”angry.gif” alt=”Angry face” title=”Angry face” />]

<img style=”float: right; padding: 0px 0px 0px 3px;” src=”gort.gif” width=”80″ height=”80″ />

Appearance wise, it’s a judgment call as to how much padding you want to place around your image relative to the text. You mostly want to avoid the appearance of text touching an image. Padding is a great way to prevent that from happening.

In example #2, I used float: left;

<img style=”float: left; padding: 3px 3px 0px 3px;” src=”girl_cry.gif” width=”80″ height=”80″ />

For reference, padding values are read clockwise starting at the top of an image.

Example showing clockwise order if I used padding: 8px 3px 0px 7px;

8px arrow pad up
arrow pad rgt
7px
Padding values are read clockwise 3px
arrow pad rgt
arrow pad up 0px