Please help the noob with positioning

Please help the noob!

I am having trouble getting images to position correctly with CSS/HTML.

I want to position 3 photos (size 150x113) within a blank space to the right of a short paragraph.

HTML Code looks like this (Strict DOCTYPE):

<div class="roleimage1"><img src="placeholder.jpg" alt="placeholder"></div>
<div class="roleimage2"><img src="placeholder.jpg" alt="placeholder"></div>
<div class="roleimage3"><img src="placeholder.jpg" alt="placeholder"></div>

<p>
The companies are spread out around Melbourne:<br />
<a href="headquarters.html"><span class="wep">Headquarters (HQ):</span></a> Hawthorn<br />
<a href="acoy.html"><span class="wep">Alpha (A) company:</span></a> Sunshine<br />
<a href="bcoy.html"><span class="wep">Bravo (B) company:</span></a> Surrey Hills<br />
<a href="ccoy.html"><span class="wep">Charlie (C) company:</span></a> Sandringham<br />
<a href="dcoy.html"><span class="wep">Delta (D) company:</span></a> McLeod<br />
<a href="sptcoy.html"><span class="wep">Support (Spt) company:</span></a> Moonee Ponds<br />
</p>

First, I tried this CSS:

.roleimage1 {
float: right;
width: 150px;
}

.roleimage2 {
float: right;
width: 150px;
}

.roleimage3 {
float: right;
width: 150px;
}

However, this shoved them all to the right hand side. Not what I wanted.

Then I tried this:

.roleimage1 {
float: right;
width: 150px;
margin: 0 150px 0 0;
}

.roleimage2 {
float: right;
width: 150px;
margin: 0 30px 0 0;
}

.roleimage3 {
float: right;
width: 150px;
margin: 0 30px 0 0;
}

This puts them in the position I want, at 1024 x 768. But when you get to 800 x 600, it squashes everything up, and any higher it's too spaced out. How can I get the images to stay evenly spaced, slightly left of the centre, and work in different resolutions using CSS? Help me, please!

It would really help to see what this is supposed to look like: can you supply a link to an online page, or else make a screen shot /sketch of the desired effect?

The page is here:

http://www.users.on.net/~kynocht/role.html

I want the 3 images to go to the right of this paragraph:

"The companies are spread out around Melbourne:
Headquarters (HQ): Hawthorn
Alpha (A) company: Sunshine
Bravo (B) company: Surrey Hills
Charlie (C) company: Sandringham
Delta (D) company: McLeod
Support (Spt) company: Moonee Ponds"

Thanks!