Two CSS questions - I need help with my source

[BigToque]

My website is Here
My CSS file is Here

My two questions are these:

1. I have my main body, footer, and the stuff at the side. I want to know how to make the main body extend to the bottom of the window so there is whitespace when there isn't a full page of content (you can see that below the footer is all blue background and I don't like the way that looks)

2. I want my News section and Recaps section to be side by side, but as you can see, the Recaps section starts below the News section. I'm pretty new to CSS, so I don't even know if this is possible without tables.

 

[So]

try setting their position, I don't recall if it was relative or absolute, but you need to use that attribute.

 

[hopejr]

Floating will probably do it

 

[hopejr]

Floating does the trick. You may want to fix the padding though after what I've done:

#news {
background-color: #dedede;
margin-left: 0px;
width: 337px;
float: left;
}

#recap {
background-color: #000080;
width: 337px;
float: right;
}

#footer {
background-color: #ffffff;
margin-left: 125px;
margin-right: 125px;
text-align: center;
clear: both;
}

I removed the margin-left from #recap and just floated it to the right. The #footer must have clear: both otherwise it will end up underneath the news and recap divs.