Ok - this is a straight forward two column layout.
What I'd do (and it's no doubt not the only way - just my way!) is stick the whole lot in a container div - that way you can position everything on the page where you want it plus it holds everything together.
Then inside this container div I'd have your header div.
Follow that with another div which I'll call wrapper for no obvious reason. This div will hold the two adjacent central sections and prevent them running off!
So inside the wrapper div you'll have your left-hand div and your right-hand div which we'll float so that they're next to each other instead of one after the other. Floats can sometimes behave badly which is why I tend to stick 'em in a containing div. There are other ways to do this but I like life simple.
Following on from the wrapper div with it's two sections will be your footer div which will sit below the other two neatly.
So here's the HTML:
<div id="container">
<div id="header">
Your Header stuff goes in here
</div> <!-- end header -->
<div id="wrapper">
<div id="leftcolumn">
Your left hand stuff goes in here
< /div> <!-- end of leftcolumn -->
<div id="rightcolumn">
Your right hand stuff goes in here
</div> <!-- end rightcolumn -->
</div> <!-- end wrapper -->
<div id="footer">
Your footer stuff goes here
</div> <!-- end footer -->
</div> <!-- end container -->
And a very basic CSS:
body {font-size:101%; text-align:center;}
#container {margin: 0 auto; text-align:left; width: 760px;}
#leftcolumn {float:left; width: 159px;}
#rightcolumn {float:right; width:600px;}
#footer {clear:both; height: 100px;}
I'd suggest initially, until you get it how you like - have the CSS in the head of the document between
<style type="text/css">
<!--
and this:
-->
</style>
Once you get it how you like then paste it all into a blank page called style.css or something similar and link to it in the <head> of your page - that way all pages on your site (provided you include the link) will have the same formatting.
This format should flow downwards properly when the content is expanded. You'll obviously need to add more stuff to the styles such as padding and margins for the content. Could I also suggest that you add these to the items within the div rather than the div itself so you'll avoid problems with the dreadful IE and it's box model.
eg:
#rightbox p {margin: 10px 20px 0 20px;}
This will add a 10px top margin and a 20px right and left margin to all paragraphs within the div called rightbox.
Edit: you can then add further stuff within the #rightbox div in the same way (floating divs left and right etc) if you need to - floats within floats sometimes get a bit complicated but see what you can come up with and come back if you run into problems.
