Well, what you are experiencing is what is supposed to happen by design. When you displace (add top/left/right/bottom values) relatively positioned elements, the element is shifted to the new position, however it still holds the space of its original position. This means that you won't be able to defeat this with your current design.
Usually it is much better to use margins to move your non-absolutely positioned elements around, but unfortunately, it does not work in your case.
However, here's something you can think about doing:
1. Absolutely position the element with the graphic (#contentbanner). Since it is not really content and it contains an image of constant size, this seems like a good solution.
2. Then your content will (by default) be over the graphic and you would simply use positive top margin to move it down, either below the graphic or overlapping part of it.
3. You will have to deal with
collapsing margins on your #contentholder. I fought that by adding top padding of 1px to the element.
[small]Do something about world cancer today:
Comprehensive cancer control information at PACT[/small]