Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Are there any adverse side effects to loading html5shiv in every browser?

On the html5shiv Google Code page the example usage includes an IE conditional:

<!--[if lt IE 9]>
    <script src="dist/html5shiv.js"></script>
<![endif]-->

However on the html5shiv github page, the description explains:

This script is the defacto way to enable use of HTML5 sectioning elements in legacy Internet Explorer, as well as default HTML5 styling in Internet Explorer 6 - 9, Safari 4.x (and iPhone 3.x), and Firefox 3.x.

An obvious contradiction. So to satisfy my curiosity, for anyone who has studied the code, are there any adverse side affects to loading html5shiv in every browser (without the IE conditional)?

EDIT: My goal, obviously, is to use the shiv without the IE conditional.

like image 945
Jeff Avatar asked Oct 05 '12 14:10

Jeff


1 Answers

I think that conditional comment on googlecode's page (updated probably more than a year ago) is because IE8 and below need a javascript trick to allow css styling of HTML5 elements.

FF4, Safari 4, Opera 11 and below just don't apply display:block as default to "unknown" elements, but you only need a CSS reset to change this behaviour.

What html5shiv does on these browsers is just to add a <style> at the beginning of <head>, similar to this one:

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}

Source: http://meyerweb.com/eric/tools/css/reset/

So, it should not give any side effect, because these rules can be overwritten by successive declarations.

As long as you add that rule on top of your main CSS file, it's ok to conditionally include html5shiv for IE only, you'll save an http request.

If you want your html5 website to be compatible with FF2 too (if so, you're a maniac), check this tutorial.

OP discovered html5shiv already provides a fallback for FF2 !

like image 173
Giona Avatar answered Oct 22 '22 17:10

Giona