Text wrapping around images and floats

I have attached an image of what I want to achieve.

I tried it last night doing something like this:

<div id=“content”>
<div id="left>
<div id="logo><img src …/></div>
<p>blah blah blah…</p>
</div>
</div>

#left floated:left
#logo floated:left

The text did wrap around the logo image, BUT, I’m trying to push the logo down further into the text so the text starts above the logo and wraps down around it like in my image. Is this possible using floats?

This is the link to the page that I currently have:

www.designingyours.com/kmmed/

As you can see both the image and the text are aligned together at the top (unless you’re viewing with IE7). I probably want that image a good 50px or so down from the first line of text.

Try this:

http://johns-jokes.com/downloads/sp/designingyours/

.

oh cool you put the image within the <p>! I like it

Thanks