CSS - Css Dilemma

Ok.. Look at this page:

www.zepcom.dk/www/index.php

Here we have a small text and a news box... The small text is floated to the left and the news box is floated to the right.. The problem is however, that I wan't the news box to be farther up, and the text to sort of like dance around it.. Like if you put a picture in a word document (or similar)... so the text just fits around the news box.. how would I do this?

I am getting a 9px left margin that I do not understand. Here is a simple example;

#logobar {
background-color: #ddb;
color: #000;
border: 0;
margin: 0;
padding: 0;
text-align: left;
height: 50px;
background-image: url(primarynav.gif);
background-repeat: no-repeat;
}

I get my brown bar across the top of the screen, but it is indented by 9px on the left. Any idea why?

Hi, and thanks for reading.

I have a design that I put together in Photoshop without thinking of what I would have to do to make it a reality and then got the okay on it. That was a mistake.
I'm now stuck with this.
Which is totally fine, but then you hit this, and everything sucks.
The problem is he
Code:

#body {position:absolute; left:101px; top:13px; width:624px; height:100%;}
			#content {border:solid 3px #000000; background-color:#FFFFFF; width:613px; padding-left:80px;}

#content is inside #body. I also have a transparent image I use as a placeholder with a height of 360px, which seems to only really work if I have height:100% in #content. The problem with that is then any page where the content is over 360px, like in the first link, overlaps #content even though it's all inside content as <p>, <table>, <form>, etc.

My question is, what can I do to fix this? If there's nothing that will work on CSS 2, then I could always just add some extra lines at the bottom of pages with little content. Problem is, this is going to eventually be backed by a CM used by totally clueless people who won't understand the purpose of the extra lines even if I explained it.

Any ideas?
Thanks in advance,
-colin