Question

I am trying to make IE7 render HTML5 using html5shiv; I thought html5shiv would fix these issues. However, Internet Explorer's debugbar is still griping about HTML5 tags.

debugbar_output

How can I fix this using html5shiv to use the same HTML5 content without errors in debugbar?

<!DOCTYPE html>
<!--
   See this page for language codes:
   http://tlt.its.psu.edu/suggestions/international/web/tips/langtagscript.html
-->
<html class="no-js" lang="en-US">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>HTML5 Page Template</title>
    <!--
         html5shiv via CDN
         Provides HTML5 support in hateful IE versions
         CDN: http://cdnjs.com/
    -->
    <!--[if lt IE 9]>
        <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6/html5shiv.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <div id="page">
    <header>
      <h1><a href="#">Standard HTML5 Page</a></h1>
    </header>
    <nav>
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">Archives</a></li>
        <li><a href="#">About</a></li>
      </ul>
    </nav>
    <section id="featured">
      <article>
        <header>
          <h1><a href="#">Title Foo1</a></h1>
        </header>
        <section>
          <p>Lorem ipsum...</p>
        </section>
      </article>
      <article>
        <header>
          <h1><a href="#">Title Foo2</a></h1>
        </header>
        <section>
          <p>Lorem ipsum...</p>
        </section>
      </article>
    </section>
    <section id="ads">
      <a href="http://careers.stackoverflow.com/">Get a better job!</a>
    </section>
    <footer>
      <p>Insert footer info here</p>
    </footer>
    </div>
  </body>
</html>
Was it helpful?

Solution

You don't. html5shiv only makes it possible to style those elements. IE7 still won't know about them.

OTHER TIPS

I've also had problems getting html5shiv to work in IE Tester (assuming you're using IE Tester), which I found do not occur when I force IE8 to emulate IE7 using a tag, like so:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7;">

(See my answer to a similar question here). Based on this experience, I suspect IE Tester might have a problem with html5shiv: it might be worth testing your page in actual IE7 to make sure there really is a problem here.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top