Problems with css columns - Non-profit website

Can anyone give me a hand with my CSS? I have three columns set up on my home page, but the center text seems to overlap the right side column. I only noticed this recently, but I do remember that I had to tweak some of my margins because of some funky spacing with IE. My problem is that my css skills are about a 3 out of 10 so any assistance would be greatly appreciated. Thanks!

Here's the page...

http://www.healthyschoolscampaign.org

 

Hey!

The content is overflowing because the div id "mainheadline" has a width of 420px, replace the code with this:

#mainheadline
{
float:left;
padding:0 10px 0 10px;
width: 410px;
<!--[if IE 6]>
width:400px;
padding:0 0px 0 0px;
<![endif]-->

}

Code (markup):

I simply changed the width to 410px.

Seems ok with me, let me know if not.

 

For another take, I simply changed this:

#maincenter {   /* frontend.css (line 155) */
  float: left;
  margin: 5px 10px 0 15px;
  width: 400px;
  }

Code (markup):

cheers,

gary