You should really do this in your stylesheet, normally called style.css.
When you insert an image in your post, you use the (X)HTML editor and you add a class to your image tag:
<img src="someimage.jpg" class="left"
….>
In your stylesheet you add a style rule to left align the image and give it some space to the right and bottom:
.left{
float:left;
margin:0 10px 5px 0;
}
This rule will give a 10 pixel margin to the right of the image and 5 pixels below.
Change to your satisfaction. For a right aligned image you can use a class "right":
<img src=”someimage.jpg” class=”right” ....>
and a style rule:
.right{
float:right;
margin:0 0 5px 10px;
}
This lets you have text to the left of the image with some space to the left and below the image.
Lovely. I thank you greatly for this.
If you use pictures alot and cant be bothered to insert a class=”” tag for every picture, an alternative solution can be to make a border in the colour as the background.
.posts img {border: 3px solid #ddd; padding:2px; background-color: #fff;}
In this example the border is 4 pix wide. This solution makes a border on all sides of the picture. If you perfer more space, this might look foolish.
I have no idea why it should be 4 px wide, when it clearly is 3. Sorry