IE not positioning divs correctly, My site is fine in other browsers, but in IE, my "main-box" Options

[vamvam33]

My site is fine in other browsers, but in IE, my "main-box" area overlaps my the other content. I think its a div error, but I've tried chaning things and cannot make it work.

Site: http://www.vamdesign.com

css:
#container {
height: 768px;
width: 1024px;
z-index:-1;
background-image: url(images/VAMDesignbkg.png);
background-repeat: no-repeat;
position: absolute;
margin-left: -512px;
left: 50%;
padding: 0px;
}
#main-box {
position:absolute;
width:640px;
height:480px;
z-index:-1;
background-color: #FFF;
top: 42px;
left: 184px;
border-radius: 25px;
-moz-border-radius: 25px;
-webkit-border-radius: 25px;
behavior:url(border-radius.htc);
border: 1px solid #050DAE;
margin: 0px;
padding: 0px;
}


html:
<div id="container">
<div id="main-box">
<div id="iamdesign">
<img src="images/iamdesign.png" width="213" height="32" alt="iamdesign" /></div>
<div id="text-here">
<h1>Hi, I’m Vicki A. Morawietz & I AM a Visual Designer, Art Director, GUI, & UI designer, <span class="ninja">photoshop</span> <span class="ninja">ninja, </span>& <span class="guru">illustrator</span> <span class="guru">guru</span>.</h1>
<ul class="navlist">
<li>Success in web design, user interface, and print for fortune 500 companies <br />
</li>
<li>Creative skills that exceed design trends and drive sales<br />
</li>
<li>Adaptive and comfortable in small scale or executive corporations<br />
</li>
<li>Ambitious with excellent leadership skills</li>
</ul>
<p class="space">I have excellent attention to detail, am well organized, efficient, and able to communicate creative ideas from concept to delivery. I enjoy challenges, have owned and operated my own graphic design business, built a creative services department from the ground up, as well as managed a team of graphic designers. I always strive to move forward in design and in life.<a href="contact.html"> Contact me.</a><br />
</p>
<div id="buttonplace">
<p> <a href="VMorawietz.pdf" class="download">Download Resume</a></p>
<div id="webdesign">
</div>
</div>

I've tried to change the z-index of #container to -1 and when I do, the background image goes to the background but then I loose all the info that is in the #main-box, when I change that z-index for #main-box, nothing changes.

Let me know if you need the full css. I'm at a loss here.

Thank you.

[pandy]

In an a little older version of gecko (FireFox) nothing shows up except the yellow background. The page is totally blank.

I would fix the errors to start with.
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes
http://jigsaw.w3.org/css-validator/validat...ng=&lang=en

You can ignore the errors for proprietary CSS extensions, but the rest should be fixed.

[vamvam33]

Yes, I've already done the validation sites, both css and html the stuff that shows up concerns the shadows and rounded corners... but nothing else seems to be wrong according to the validation sites.

What can I do about the internet explorer issue do you think?

[vamvam33]

Ok, now I'm thinking its not the css... but I downloaded these hacks to fix the rounded corners:
http://code.google.com/p/curved-corner/downloads/list

I think this is what is breaking the site.