Border problem

I’ve been creating a website for my portfolio, and I’ve hit a bizzare problem.
Look at this link: http://freewebs.com/phi_studios/Blog%20idea/test3.htm
How can I make the box around the words Projects Catalogue “swallow” the two columns below?
I’m not stupid, and I put a div around the columns. When I did, it stayed around the header and the bottom box swallowed it for it. For now, I have written clear:both to avoid any messiness.

I believe the problem has to do with floating the columns, because when I had un-columned text there it was a-okay.

If you need to see exactly what effect I’m trying to achieve, I have attached an image where I edited a screenshot. (The quality has been dramatically reduced to load onto K because I’m lazy.)

Thanks. Alot.