title: Why does IE 8 load the <head> tag below the <body> tag doesn't occur on IE 7 and 9
body: <p>The title explains it all. Here are the screenshots I've got on </p>
  
  <p>IE8: <a href="http://screencast.com/t/Sc4XXe8jFfu9" rel="nofollow">http://screencast.com/t/Sc4XXe8jFfu9</a></p>
  
  <p>IE7: <a href="http://screencast.com/t/xeyRCzXN3" rel="nofollow">http://screencast.com/t/xeyRCzXN3</a></p>
  
  <p>It's a bit weird but it's causing a lot of css issue on my website since the precedence is not correct.</p>
  
  <p>TIA</p>
  
  <p><strong>EDIT</strong></p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /&gt;
      &lt;link rel="stylesheet" media="screen" type="text/css" href="&lt;?php echo $this-&gt;getThemePath();?&gt;/css/bootstrap.css" /&gt;
      &lt;!-- &lt;link rel="stylesheet" media="screen" type="text/css" href="&lt;?php echo $this-&gt;getThemePath();?&gt;/css/responsive-nav-media.css" /&gt; --&gt;
      &lt;link rel="stylesheet" media="screen" type="text/css" href="&lt;?php echo $this-&gt;getThemePath();?&gt;/css/responsive-nav.css" /&gt;
      &lt;link rel="stylesheet" media="screen" type="text/css" href="&lt;?php echo $this-&gt;getStyleSheet('typography.css')?&gt;" /&gt;
      &lt;link rel="stylesheet" media="screen" type="text/css" href="&lt;?php echo $this-&gt;getStyleSheet('main.css')?&gt;" /&gt;
      &lt;!--[if IE]&gt;
      &lt;style type="text/css"&gt;
          body#theme-wrapper #header {
              position: relative;
          }
      &lt;/style&gt;
      &lt;link rel="stylesheet" media="screen" type="text/css" href="&lt;?php echo $this-&gt;getThemePath();?&gt;/css/ie.css" /&gt;
      &lt;![endif]--&gt;
      &lt;script type="text/javascript" src="&lt;?php echo $this-&gt;getThemePath();?&gt;/js/modernizr.custom.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="&lt;?php echo $this-&gt;getThemePath();?&gt;/js/grayscale.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          Modernizr.load([
            {
              test : Modernizr.mq('only all'),
              nope : '&lt;?php echo $this-&gt;getThemePath();?&gt;/js/respondjs.js'
            }
          ]);
      &lt;/script&gt;
      &lt;script type="text/javascript" src="&lt;?php echo $this-&gt;getThemePath();?&gt;/js/responsive-nav.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="&lt;?php echo $this-&gt;getThemePath();?&gt;/js/bootstrap.min.js"&gt;&lt;/script&gt;
      &lt;link href="http://fonts.googleapis.com/css?family=Raleway:400,100,700" rel="stylesheet" type="text/css" /&gt;
  &lt;/head&gt;
  </code></pre>