Website middle column breaks in ie7 and ie8 compatibility mode.

[gt0]

It loads correctly in Firefox and IE8, but the middle column breaks in ie7 and ie8 in compatibility mode.

By break I mean the middle column gets shifted to the right and below the right column (while still in the middle column)
View the link in ie7 or ie8 compatibility mode to see what I mean.
http://www.thestardock.net/index.php
I have also included the general layout and css below.

I have tried changing doc types and a few small things but nothing has even effected the appearance.

The website is in a layout like this:

<div id="wrapper1">
<div id="wrapper2">
<div id="maincol">

<div id="leftcol">
</div>

<div id="rightcol">
</div>

<div id="centercol">
</div>

</div>

<div id="footer">
</div>

</div>
</div>


#centercol {
position:relative;
padding:0 200px;
min-width: 520px;
}
#leftcol {
position:relative;
top:-10px;
left:-10px;
float:left;
width:180px;
margin:0 0 -10px 0;
padding:10px;
z-index:100;
}
#rightcol {
position:relative;
top:-10px;
right:-10px;
float:right;
width:180px;
margin:0 0 -10px 0;
padding:10px;
z-index:99;
}
#maincol {
position:relative;
margin:0;
padding:10px;
}

#wrapper1 {
position:relative;
text-align:left;
width:100%;
min-width: 950px;
background:#23415C url("images/side.gif") repeat-y top right;
}

#wrapper2 {
position:relative;
text-align:left;
width:100%;
background:url("images/side.gif") repeat-y top left;
}

[Wickham]

Your wrapper is min-width: 950px; the left and right columns are 180 + 2*10px padding = 2*200px leaving a space of 550px.

Your #centercol has side padding of 200px which increases its width to 920px so it doesn't fit in the middle space of 550px in IE7 ( Firefox guessed that you didn't mean that) so change the padding to margin which allows the side columns to fit in the margins
#centercol {
position:relative;
/*padding:0 200px;*/ margin: 0 200px;
min-width: 520px;
}

You also have an unclosed comment here (which wasn't part of the problem)
#rightcol {
position:relative;
top:-10px;
right:-10px;
float:right;
/* width:200px; /* for IE5/WIN */
width:180px; /* actual value */
margin:0 0 -10px 0;
padding:10px;
z-index:99;
}
which should be
#rightcol {
position:relative;
top:-10px;
right:-10px;
float:right;
/* width:200px;*/ /* for IE5/WIN */
width:180px; /* actual value */
margin:0 0 -10px 0;
padding:10px;
z-index:99;
}