Question

I’m hoping someone else has some input into what’s going on here. When I originally worked on this site in ’09, I tested it on several versions of internet explorer and it worked acceptably, but in IE9 it comes out like this. (comparison of correct and IE9 versions. it should be obvious which is which.)
What’s confusing me most about this is that the box containing the main text seems to have been duplicated. While I do have two elements here that could be creating the impression of duplication, I removed one and it still did the same. the “textbox” div, which seems to be the one causing the problem, works somewhat better if the height is not set. There is then vertical gap between it and the header of perhaps 100px, but no longer is it duplicated or below the sidebars.

Answer 1

You’ve got some markup issues that are breaking the layout of the site. For instance:

<ul>  
  <li><a href="communityed.html">Community Education and Training</a></li>      
  <li><a href="outreach.html">Outreach</a> <!-- no closing </li> -->
  <li><a href="cals.html">CLCM Programs</a></li>
</ul>

You also forgot to close an <h1>:

<div id="linksline">
  <h1>Links
</div>

Fixing these resolved your layout in IE9.

Remember, always validate. You can do this easily from within IE9 by pressing F12 and then selecting the Validate option, proceeding to choose HTML.