Ie Not Styling HTML5 Tags (With Shiv)

IE not styling HTML5 tags (with shiv)

With IE, even with the shiv, you need to declare the HTML 5 elements as block elements. I use this line for Internet Explorer, but you can modify it for the elements you need.

header,nav,article,footer,section,aside,figure,figcaption{display:block}

From the Modernizr Documentation:

You’ll also probably want to set many of these elements to display:block;

HTML5 SHIV and display: block -but styles still break in IE9- Why?

When using the Developer Tools in IE you need to make sure you change both the Document Mode as well as the Browser Mode e.g.

Settings for testing IE7 -

Browser Mode: IE7

Document Mode: IE7 Standards

Settings for testing IE8 -

Browser Mode: IE8

Document Mode: IE8 Standards.

etc.

IE8 Not Recognising HTML5 (even with shiv)

Just figured this out, thanks @Sparky672 for pointing me in the right direction.

For anyone else having this problem the curve just below the coloured shards was created using an SVG. I was under the impression that if IE couldn't render the SVG it would just ignore it, however it seemed it was mucking up everything below it.

I haven't worked out how to remove the SVG for IE 8 down yet, because commenting it out with IE conditionals doesn't seem to work - but that's another issue. Removing it fixes the styling problem!

html5 new elements (header, nav, footer, ..) not working in IE

You need to include the HTML5 shiv script in order to allow styling of HTML5 elements in older IE browsers: http://code.google.com/p/html5shiv/

To use, include the following script in your element above your CSS:

<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<![endif]-->

Can't style HTML5 elements in IE (despite shiv and display:block)

Solved the issue. What i did was that i put the script-link under the stylesheet link and suddenly IE 6-8 applied my styles.

<link rel="stylesheet" href="styles/style.css" type="text/css">

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

Thank you so much for trying to help me :)

Why aren’t my HTML5 tags being styled in IE8 when I’ve applied HTML5 shiv?

Depending on your security settings, Internet Explorer will not execute JavaScript in local files. An exception are files with a Mark of the Web.

You can change this behavior with the following setting:
Allow active content to run in files on My Computer

If Internet Explorer has even more strict settings, it may not allow JavaScript on any web site. If that is the case, you can enable JavaScript in Internet Explorer with these instructions.

HTML5 shiv are also needed for IE9 in order to support HTML5 elements

I finally managed to figure out what the problem was.
I had a comment at the top of my site, before the doctype html tag. That seems to break IE9's ability to recognize the HTML5 elements.

This is what I had:

<!-- Served From Cache: Wednesday 13th of February 2013 03:02:22 PM -->
<!DOCTYPE html>
<html>
    <head>

So I was then able to fix this by moving the comment down beneath the doctype.

IE7 & IE8 don't apply CSS to HTML5

Unable to reproduce. Using http://browserstack.com, I tested the code below in both IE7 and IE8 running natively on Windows XP, and both of them applied the CSS as expected, properly:

I can only suspect that you missed something, somewhere, and as such were not getting the results you were expecting. Try reducing your project to a small test case, as I have done here. Be sure that you have referenced all of your appropriate dependencies.

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>HTML5 Elements in IE7/8</title>
        <!--[if lt IE 9]>
            <script src="html5shiv.js"></script>
        <![endif]-->
        <style type="text/css">
            header {
                background-color: #000000;
                color: #FFFFFF;
            }
        </style>
    </head>
    <body>
        <header>Hello, world!</header>
    </body>
</html>

Screenshot:

Sample Image

Internet Explorer 8 won't modify HTML5 tags in print stylesheet

I suggest you try html5shiv. The main shiv does document.createElement() as you have but it's been optimized / minified like crazy. More importantly, it includes printshiv (IE Print Protector) which will let you style HTML5 elements for print.

Ie Not Styling HTML5 Tags (With Shiv)