Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

html5shiv not working in IE8?

I can't get styles to pick up in IE8 with HTML5 elements. I've trawled stackoverflow and Google, no suggestions I've tried work.

I started with a much more elaborate page (I'm converting an XHTML framework to HTML5) and wasn't concerned in the slightest, but after seeing zero results in emulated and F12 IE8 standards mode IE... here's the simple code I can't get working:

<!doctype html>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta charset="UTF-8" />
        <title>Template</title>
        <style type="text/css">
            header {
                display: block;
                border:1px solid red;
            }
        </style>
    </head>
    <body>
        <header>
            HTML5 HEADER
        </header>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    </body>
</html>

Please help Obi-Wan, you're my only hope.

like image 384
danjah Avatar asked Apr 09 '13 00:04

danjah


2 Answers

Move HTML5Shiv’s script element to head section, before all other style and script elements.

like image 53
Marat Tanalin Avatar answered Oct 31 '22 20:10

Marat Tanalin


Move the shiv before the style declarations.

To increase performance in modern browsers, you might want to use conditional comments for the shiv.

<!doctype html>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta charset="UTF-8" />
        <title>Template</title>

        <!--[if lt IE 9]>
            <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->

        <style type="text/css">
            header {
                display: block;
                border:1px solid red;
            }
        </style>
    </head>
    <body>
        <header>
            HTML5 HEADER
        </header>
    </body>
</html>
like image 45
Emil Avatar answered Oct 31 '22 21:10

Emil