IE7 issues with my CSS

[decepticon]

Hi, I have recently started making a website at www.centaur-design.com (http://www.centaur-design.com) and just noticed there are some browser issues when viewing in IE7 (firefox seems to be fine)

Can anyone tell me how to solve this problem as im unfamiliar with some cross browser issues.

here is my css


/* THE BIG GUYS */
* { margin:0; padding:0; }
body { padding: 0 0 0 0; color:#333;font:83%/1.5 arial,tahoma,verdana,sans-serif;background: #212121; }

/* LINKS */
a,a:link,a:link,a:link,a:hover { background:transparent; text-decoration:underline; cursor:pointer; }
a:link {color:#c00;}
a:visited {color:#999;}
a:hover,a:active {color:#069;}

/* FORMS */
form { margin: 0 0 1.5em; }
input { font-family: arial,tahoma,verdana,sans-serif;margin: 2px 0; }
fieldset { border: none; }
label { display:inline; padding: 5px 0; }
label br { clear:left; }

/* TYPOGRAPHY */
p, ul, ol { color: #fff; margin: 0 0 1.5em; font-size: 0.9em; }
h1, h2, h3, h4, h5, h6 { letter-spacing: -1px; font-family: arial,verdana,sans-serif; margin: 1.2em 0 .3em; color:#fff; padding-bottom: .1em; ;}
h1 { font-size: 1.4em; margin-top:.6em; margin-bottom:.6em; border-bottom: 1px solid #dcbc10; font-weight: normal; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.4em; }
h4 { font-size: 1.3em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.1em; }
.highlight { color:#E17000; }
.subdued { color:#999; }
.error { color:#c00; font-weight:bold; }
.success { color:#390; font-weight:bold; }
.caption { color:#999; font-size:11px;}
.date { font: bold 82% arial; color:#bbb; display:block; letter-spacing: 1px; }
small { font-size:11px; }

/* LISTS */
ul { margin: .3em 0 1.5em 0; list-style-type:none; }
ul.related { margin-top: -1em; }
ol { margin: .5em .5em 1.5em; }
ol li { margin-left: 1.4em; padding-left: 0; background: none; list-style-type: decimal; }
li { line-height: 1.4em; padding-left: 25px; background: transparent url("../images/sprites.gif") no-repeat 0 0; }
li.doc { background-position: 3px -500px; }
ul.nomarker li { background:none; padding-left:0; }

dl { margin: 0 0 1em 0; }
dt { font-weight:bold; margin-top: 1.3em; }
dl dl { margin: 0 0 1.5em 30px; }

/* GENERAL */
img { border:none; }
hr { margin: 1em 0; background:#f2f2f2; height:1px; color:#f2f2f2; border:none; clear:both; }
.clear { clear:both; position:relative; font-size:0px; height:0px; line-height:0px; }

/* 'MORE' LINK */
a.morelink:link, a.morelink:visited, a.morelink:hover, a.morelink:active { background: transparent url("../images/sprites.gif") no-repeat 5px -500px; padding-left:21px; }
a.morelink:hover { background: transparent url("../images/sprites.gif") 5px -400px; }
.morelink span { position:absolute; left:-9999px; width:900px; }

/* LAYOUT - HEADER */
#header {
position: relative;
background: #fff;
height: 186px;
background: url("../images/header.jpg") no-repeat;
border-bottom: 1px solid #dcbc10;
}
#header h1 {
margin: 0; padding: 0;
}


/* SEARCH */
#search {
position: absolute;
top: 5px; right: 10px;
color: #fff;
font-weight: bold;
}
#search form { margin:0; }
#search label { padding:5px 0 0; display:inline; }

/* NAV */
#navbar {
margin: 0;
height: 30px;
width: 1000px;
border-bottom: 1px solid #dcbc10;
border-top: 1px solid #dcbc10;
float: right;
}
#navbar li {
margin: 0; padding: 0;
display: inline;
list-style-type: none;
}
#navbar a:link, #navbar a:visited {
float: left;
line-height: 2.2em;
font-weight: bold;
padding: 0 12px;
text-decoration: none;
color: #708491;
}
#navbar a:link.active, #navbar a:visited.active, #navbar a:hover {
color: #000;
}

/* LAYOUT - main body of page */
#wrap {
width: 1000px;
margin: 0 auto;
border-right: 1px solid #dcbc10;
border-left: 1px solid #dcbc10;
}

#content-wrap {
width: 1000px;
}
#content {
float: right;
width: 813px;
padding: 0 15px 10px;
background: #000 url("../images/content_bg.jpg") no-repeat;
}
.featurebox {color:#333;padding: 15px 20px 20px;border: 1px solid #d7d7d7;margin: 0 0 1.5em;background: #f6f6f6 url("../images/featurebox_bg.gif") no-repeat 100% 100%}
.featurebox p, .featurebox h1, .featurebox h2, .featurebox h3, .featurebox h4, .featurebox h5, .featurebox h6 {margin: 0 0 .3em;border-bottom: 1px solid #c00;color:#c00}
.featurebox p {border:none;margin: 0 0 1em;color:#444}
.featurebox a {font-weight:bold}

.thumbnail {margin: 0 0 0 10px;position:relative;z-index:9999;border: 1px solid #eee;float:right;width:100px;padding:5px;background:#fff}
.thumbnail img {border: 1px solid #000}
#sub {
position: 0;
width: 156px;
background: #000 url("../images/nav_bg.jpg") no-repeat;
border-right: 1px solid #dcbc10;
}

#footer{
clear: both;
width: 1000px;
height: 25px;
background: #0d0d0d;
color: #fff;
text-align: center;
padding: 10px 0;
border-top: 1px solid #dcbc10;
border-bottom: 1px solid #dcbc10;
}

[krautinator]

an easier way to get a fix for your code is actually deleting/changing sections of code one by one to narrow down where the problem is, then you can try to find a workaround for whatever BS microsoft issue you have (and prepare for more as you continue building your page)

my guess is that you have a positioning problem of sorts from the looks of it

[_Aerospace_Eng_]

You need to validate your page. See your errors here (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.centaur-design.com%2F).

[krautinator]

well he is doing better that google.com which came up with 49 errors lol :D