Placement gone crazy

I have been developing a new design for a client but when I have sucked in their content it's going crazy. Here's an example:

http://viperdesign.co.uk/dev/ese/brochures.asp

Can someone tell me why the 'General' heading sits in line with the bottom of the left column rather than under the last paragraph? The 'General' is a div styled as:

.subheading {padding: 3px; padding-left: 1em; padding-right: 1em; font-weight: bold; border: 1px outset; clear: left; font-size: 110%; 
			margin-bottom: 1.5em; margin-top:1.5em; }

Code (markup):

The layout was a basic DW template so I'm hoping there is nothing wrong with it! Any help would be appreciated

 

In the code take out clear: left and see if that works

 

oh you beauty!

Works a treat, thanks a bunch matey

 

Thing is though, why does the clear not just clear the element above but rather the lefthand sidebar? Surely the sidebar shouldn't come into the equation

 

If the sidebar is a float element, it does.

See enclosing float elements for other methods of containing floats in a new block formatting context.

cheers,

gary