title: CSS and Internet Explorer div position problems
body: <pre><code>body {
  background-image: url(pattern.jpeg); background-attachment: fixed;
  font-size:12px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  text-align: center;
  }
  
   h1,h2,h3
   {
   color : #6685a8;
   }
  
   div#outer {
  width: 960px;
  background-color:#FFFFFF;
  margin-top: 00px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  border: thin solid #000000;
  text-align: left;
   }
  
   div#header {
  padding: 5px;
  margin: 0px;
  text-align: left;
  background-color :#8bb8e8;
   }
  
   div#nav {
  width: 160px;
  height: 1669px;
  padding: 0px;
  margin-top: 0px;
  float: left;
  background-color:#6685a8;
   }
  
   div#navright {
  width: 160px;
  height: 1669px;
  padding: 0px;
  margin-top: 0px;
  background-color:#6685a8;
    }
  
   div#main {
  float:top;
  margin-top: 0px;}
  
   div#footer {
  font-size:12px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  padding: 15px;
  margin: 0px;
  border-top: thin solid #000000;
  }
  </code></pre>
  
  <p>Once I create the html for it it just has a small header two sidebars and the main part in the middle(which is just a picture) and the footer contains all the information, it is also all centered on the page.  The problem is it works fine in chrome and firefox, but when I open it in internet explorer it puts the Main.div and the Footer.div below everything, I need it to be at the top between both the nav.div and right.div</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;link href="carguys.css" rel="stylesheet" type="text/css" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="outer"&gt;
      &lt;div id="header" &gt;
      &lt;p&gt;
       &lt;/div&gt;
      &lt;div id="nav"&gt;
          &lt;img src="" alt="" width="160" height="400" align="middle"/&gt;
      &lt;/div&gt;
      &lt;div id="navright"&gt;
  
      &lt;/div&gt;
       &lt;div id="main" align="center"&gt;
          &lt;img src="" alt="" width="640" height="400"&gt;&lt;/img&gt;
      &lt;/div&gt;
      &lt;div id="footer"&gt;
          &lt;h1 align="center"&gt;The Show&lt;/h1&gt;
       *lots of content in this section, including a table*
      &lt;/div&gt;
   &lt;/div&gt;
   &lt;/body&gt;
  </code></pre>
  
  <p></p>