Everywhere I look on the web (the web developer web that is) is CSS3 this, jQuery that, shadows, HTML5.
Such a tease, what about our minimum browser requirements spec? Damn IE6 is yet again 10% of the target demographic.
Not only is IE6 the problem, but so is the most recent IE8, as well as IE7. They just don’t support CSS3 and HTML5.
Now we have some solutions…
CSS3 PIE for Internet Explorer
CSS3 PIE is a plugin that enables IE6-8 through the use of the ever useful (yet slightly annoying) .htc file. We’ve used it before to fix (somewhat) PNG transparencies, and now it lets CSS3 PIE work.
CSS3 PIE enables the following CSS3 properties on IE6, IE7 and IE8 (IE9 will have support out of the box):
- border-image (still preliminary support)
- -pie-background (yes, not the default CSS3 name, but it still works)
- -pie-watch-ancestors (it just means it works like other CSS3 changes)
- rgba colors – yay alpha!
HTML5 has all sorts of great new elements such as <header>, <nav>, etc. We can finally build pages without having tons of <div class=”header”> etc, and have the terms standardized across websites.
Internet Explorer will not recognize these unofficial elements. Unlike Chrome, Firefox, Opera, and the rest of the browser world who will gladly assume the element is acceptable, and render / CSS just like any other element — Internet Explorer ignores them. If you used <header> tags on your site, Internet Explorer (yes, even 8 ) will just ignore the existence of the code.
HTML5 Shiv (by remysharp) takes advantage of the Internet Explorer rendering engine’s ability to handle these elements only after they have been inserted into the DOM via document.createElement — and works well.