IE Problems

[keydin]

I designing a theme for wordpress 2.3.1 on my site but I am having some weird problems. steveeller.com (http://steveeller.com)

1. When viewing in IE 7.0 the front page shows up but when you take one of the links in the "recent posts" it just goes to a blank page.

2. In IE 7.0 in my "recent posts" the posts are in a list, but you will see the type gets smaller as it goes down the list.

I am not sure if this is a css/xhtml problem or wordpress. I can view the site perfectly in FF, Flock, and Safari.

Can you help? Here is the CSS:


body, html {
font-family:Arial, Helvetica, sans-serif;
background-color:#343b48;
margin: 0;
padding: 0;
text-align: center;
color:#a3a6ac;
height:100%;
}
img {
border:none;
}
h1 {
color:#ebe64f;
text-transform:uppercase;
font-size:18px;

}
h2 {
color:#ebe64f;
text-transform:uppercase;
font-size:90%;

}
a, a:visited {
color:#ebe64F;
text-decoration:none;

}
a:hover {
text-decoration:underline;

}
li {
list-style:none;


}
ul {
list-style:none;

}
.mainclass #container {

width:800px;
margin:0 auto;
text-align:left;


}
.mainclass #header {
height:91px;
margin-top:20px;


}
.mainclass #headericon {
float:left;
background-image:url(images/tree.gif);
background-repeat:no-repeat;
width:100px;
height:91px;
padding-right:10px;

}
.mainclass #headerlogo {
padding-top:35px;
text-align:left;

}

.mainclass #rss {
text-align:right;
margin-top:-17px;
font-size:75%;


}
.mainclass #rss a, .mainclass #rss a:visited {
display:inline-block; /* for all browsers except IE */
color:#a3a6ac;
text-decoration:none;


}
.mainclass #rss a:hover {
display:inline-block; /* for all browsers except IE */
color:#fff;
text-decoration:underline;


}
.headermenu {
margin:0;
text-align:left;
list-style-type:none;
text-transform:uppercase;
white-space:nowrap; /* keep text on one line */
border-top-color: #a3a6ac;
border-bottom-color: #a3a6ac;
border-top-style: solid;
border-bottom-style: solid;
border-top-width:1px;
border-bottom-width: 1px;
margin-left:110px;
height:20px;
padding:0;
margin-top:5px;
}
.headermenu li {
font-size:90%;
float:left;
padding-right:25px;
}
.headermenu a {
text-decoration:none;
font-size:smaller;
color:#a3a6ac;
}
.headermenu a:hover {
color:#fff;
border-bottom-color: #ebe64f;
border-bottom-width: 2px;
border-bottom-style: solid;
}
.mainclass #clearfloat {
clear:both;

}
.mainclass #maincontent {
padding-top:20px;
overflow:auto;

}
.mainclass #columnleft {
float:left;
width:50%;

}
.mainclass #columnright {
float:right;
width:50%;
text-align:right;
background-image:url(images/recentbackground.jpg);
background-repeat:no-repeat;
width: 371px;
height:270px;

}
.mainclass #posts {
float:left;
padding-left:20px;

width:66%;
margin:0;
}

.mainclass #sidebar {
width:31%;
float:right;
text-align:left;
height:100%;

}
.postbox {
height:270px;
width:80%;
padding-left:20px;
padding-right:20px;
padding-top:30px;
text-align:left;
}
.mainclass #footer {
text-align:center;
padding-top:20px;
font-size:85%;

}
.mainclass #page {
float:left;
width:100%;
font-size:92%;
}
.mainclass #dsidebar li {
font-size:90%;
margin-left:-20px;
}
.mainclass #readpost a, .mainclass #readpost a:visited {
display:inline-block; /* for all browsers except IE */
color:#a3a6ac;
text-decoration:none;

}
.mainclass #readpost a:hover {
display:inline-block; /* for all browsers except IE */
background-color:#ebe64f;
color:#000;
text-decoration:none;