I was reading a discussion on a forum last week about HTML5, and thought I’d have a quick mess around with it to see what happened with various browsers. I created a test page using the new tags provided by HTML5 (<header>, <footer> etc.).
This page doesn’t display correctly in any browser that I tested (FF3, IE6/7/8, Chrome2, Safari 4, Opera 9.63 or even Opera 10 beta2), although FF, Chrome, Safari and Opera all display the <aside>
element correctly for some reason.
I then applied display:block
to the css for all the new elements and tried again here.
Slightly to my surprise the page looks fine in FF, Opera , Chrome and Safari. Slightly less surprisingly, it fails horribly in IE6 and IE7. The biggest surprise for me was that it looks just as bad in IE8. I suspect, on reflection, that the browsers that worked did so because of their treatment of unrecognised html elements, rather than their support for the new HTML5 elements.


Here’s what it looks like in IE8 on the left (pretty much the same as in IE7 and IE6) and here’s how it should look in Opera 9 on the right. I have to say I expected it to be OK in IE8, given that’s the pretty much the newest browser I tested with. So much for HTML5 support in IE8…
Conclusion: being able to use even the simpler features of HTML5 looks a long way off…
Tags: browsers
HTML5 isn’t a standard at the moment, and I’m not happy relying on javascript to make IE display properly – the absence of the js has a disastrous effect on display, as this page shows. That’s why I stick to XHTML strict at the moment.
I have been using an HTML5 shiv for a couple of years using conditional comment for IE & based on
“http://html5shiv.googlecode.com/svn/trunk/html5.js”
and it has allowed me to code with all HTML5 features. HTML5 makes web dev for me simpler and more feature packed. I convert many sites like this with an old XHTML doctype to HTML5 & that brings them into the modern web dev era! I suggest you give it a try now! I’m sure you too will enjoy & benefit from the HTML5 standard which imho has many benefits 🙂