masthead div with 2 columns css - how?

basic question on how to replace a two column table

[absorption]

i've got a masthead div that i've created:

#masthead{
position: relative;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 70px;
background-color: #000000;
}

straightforward.

in my html, i call the masthead div and have a set of 3 graphics inside it that start from the left of the masthead. i have a 4th graphic that i want to be aligned at the right side of the masthead. (the overall effect is like a two column table, where the contents of the left side cell are left aligned, the righ side cell are right aligned.

what is the simplest way to achieve this?

i've tried applying float to the 4thimage and some other ideas, but these commands, while making the graphic right-aligned, drop it below, outside the masthead.

thanks for the help.

[4css]

Hi absorption,
I think that you might have some of your positioning wrong. You should only have top and right or left. Not all four positions. What happens is that if you put left and right they pull against each other, same with top and bottom.

Also, if I am remembering correctly from my reading, there are some browsers that don't accept the bottom position.

I'm sure someone with more experience then I can give you better information. I am only going by what I have just recently read.