Why does IE 7 not render this site correctly?

Look at my开发者_JS百科 website: www.mrdavisonline.com It renders correctly in Chrome and Firefox, but IE 7 butchers it. I am a high school math teacher with some programming experience, and this summer I decided to get full control of my webpage for my classes. I found a fluid web template online and worked on my website. I don't know a lot about css (other than what I taught myself). What am I missing? Many of my students are still using IE 7 which means they can't access my page. Any help would be appreciated.

Problems here too:

<h3>Mr. Davis Online<h3/>
<h4>Healdsburg High School<h4/>

closing those tags should be

</h3> not <h3/>

You have

Body {font-size:62.5%}

which will be a problem for sure. Don't use a percentage here - px, em are fine.

I also think the order of your H1 shorthand is off. Should be:

font:font-style | font-variant | font-weight | font-size | line-height | font-family

Compare to yours:

H1 {bold 2em Tahoma, sans-serif}

This is going to be your start. Basically the pages are having invalid markup. Checking the site through the W3C validator, you have many errors scattered throughout your pages. Please get a web editor which can give you some real time validation and start working through your errors. Once you do that I'm sure that you'll be much closer to having your site render in IE7 the way you think it should.

Good luck, and I hope this helps you some.