Using HTML5 tags without JavaScript in IE

HTML5 is all the rage at the moment. All the cool kids are doing it.

Dear old IE, however, doesn’t allow you to use the new tags, such as <article>, <nav> etc in your CSS.

There is the popular ‘HTML5Shiv’ which basically does the following in JavaScript:

document.createElement("article");
document.createElement("nav");

But what if you have to make your sites work 100% in IE without JavaScript? Well, you can do the following using conditional comments:

Obviously then, you need to use the classnames, not the elements themselves in your CSS.

Ugly? Yes. But it works!

4 thoughts on “Using HTML5 tags without JavaScript in IE

  1. Giakoumettis Giwrgos

    Cool but… i think if your html is small ratio of html/content you get overhead and that’s not the best way.

    still… its a good solution without using the html5Shiv

  2. Nordine

    <!–[if lt IE 9]><div class=”article”><![endif]–>
    <!–[if IE 9]><!–><article class=”article”><!–<![endif]–>
    This is an article!
    <!–[if lt IE 9]></div><![endif]–>
    <!–[if IE 9]><!–></article><!–<![endif]–>

    would do the job as IE9 and other non IE browsers will ignore the comment.

Comments are closed.