Manual adjustment of text around a floated div

The content section of my page is made up of a left floated text box, a right floated image and the content wraps around both.

"Heading One" appears to the immediate right of the text box, followed by a short piece of text [which will vary in length from page to page]. I am trying to make "Heading Two" appear below the text box [ie, in the normal position of the first line of wrapped text]. I have used both a "Spacer" and assigned an id to the first <P> tag with padding-bottom:40px; [individually of course] and both work OK but this does not seem like good CSS, and, like I said, the length of the first paragraph may vary in length.

Can anyone point me in the right direction please?

Thanks in advance.

Spook

Cut down code as follows:

h2{
font-size:120%;
font-weight : bold;
display : inline;
}
.textbox{
color: #7C7C7C;
font-size : 1.5em;
font-weight : bold;
text-align:left;
width: 8em;
border-right: 1px solid #009;
border-bottom: 1px solid #009;
padding: .5em;
margin : 0 .5em .5em 0;
background-color : #FFF;
}
.left{
float:left;
margin-top: 15px;
margin-right : 35px;
clear : right;
}
.right{
float:right;
margin-top : 15px;
margin-left : 35px;
clear : left;
}

and...

<div class="textbox left"><h2>Text Text Text</h2></div>
<img class="right" src="images/blah.gif" width="182" height="400">
<h2>Heading One </h2>Text text text.
<h2>Heading Two</h2></p>
<p>More text... </p>