The way you need to think about it is using HTML to get all the elements you need onto the webpage, and using the CSS stylesheet to move and colour and style them into place.
So for the first part, the top banner you could maybe wrap into a <div> and put the two images into that <div> ;
<img src="top_banner_left.jpg" alt="" />
<img src="top_banner_right.jpg" alt="" />
If you're using XHTML I believe those two images should already sit side by side, and by removing all margins as you already seemed to do, they ought to line up nicely.
But to make things even neater, how about merging those two left and right images together in your image editor (Photoshop or whatever you use) and load it onto your webpage whole? It'd be less code and it'd make styling easier too.
If that background to the top table is important, put that into the stylesheet too;
And continue with that methodology throughout. Replace tables with containers (if necessary), load images onto webpage, style them into place.