Floating DIVS still disappearing under Footer in IE

I've been finding plenty of posts that recommend using the "clear:both" definition in the containers I have that hold my Float DIVS. But for some reason, it's still not fixing my overlap problem in IE. It works fine in everything else. The float divs disappear behind my footer.

I have a centered Wrapper. In that wrapper, I have a container called "maincontent" and inside maincontent" I have four floating divs (2 left, 2 right).

The reason I have Wrapper and Maincontent is because I have two separate backgrounds going on.
Does anyone have a quick fix for the overlap issue?

Below is html:
<div id="wrapper">
<div id="MainContent">
<div id="stageheader_left">
<p>content content content</p>
</div>
<div id="stagecontainer_right">
<p>content content content</p>
</div>
<div id="stageslideshow_right">
<img src="blahblah.jpg" />
</div>
<div id="emptydiv">&nbsp;</div>
</div>
<div id="emptydiv">&nbsp;</div>
<div id="Footer">
<p>copyright 2007</p>
</div>
</div>

----and here's my css:----
#wrapper{
position: relative;
clear:both;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
margin-bottom: auto;
width: 830px;
background-image:url('backgroundrepeat.jpg');
background-repeat:repeat-y;
text-align: center;
}

#emptydiv {
clear: both;
}

#stageheader_left {
float: left;
margin-top: 80px;
margin-left: 55px;
padding-left: 0px;
padding-right: 0px;
background: #d9d9d9;
width: 416px;
}
#stagecontainer_left {
float: left;
margin-top: 10px;
margin-left: 55px;
padding-left: 15px;
padding-top: 7px;
padding-bottom: 7px;
padding-right: 15px;
background: #d9d9d9;
border: solid #8a8a8a 1px;
width: 414px;
text-align: left;
}
#stagecontainer_right {
float: right;
margin-top: 10px;
padding-top: 3px;
padding-bottom: 8px;
margin-right: 55px;
margin-left: 0px;
padding-left: 15px;
padding-right: 15px;
background: #d9d9d9;
border: solid #8a8a8a 1px;
width: 224px;
text-align: left;
}
#stageslideshow_right {
float: right;
margin-top: 10px;
padding-top: 0px;
padding-bottom: 0px;
margin-right: 55px;
margin-left: 0px;
padding-left: 0px;
padding-right: 0px;
background-color: transparent;
width: 256px;
}

#MainContent{
padding-top: 70px;
width: 830px;
height: 577px;
margin-bottom: 20px;
padding-bottom: 10px;
background-image:url('topcontentbg.jpg');
background-repeat: no-repeat;
padding-bottom: 0px;
text-align: center;
font-family:Arial, Helvetica, sans-serif;
font-size: 11px;
color: #0000000;
}

#Footer{
clear: both;
width: 830px;
font-family:Arial, Helvetica, sans-serif;
background-image:url('footerbg_high.jpg');
background-repeat: no-repeat;
color: #8a8a8a;
font-size: 11px;
line-height: 14px;
padding-bottom: 0px;
padding-top: 8px;
margin-bottom: 0px;
height: 281px;
background-color: #8a8a8a;
}

Any help is much appreciated. You all are awesome!