Internet Explorer compatibility madness - bahkified/Notes GitHub Wiki

IE can be a major pain in the ass when dealing with HTML5, especially the older versions which may not support all, or even any, features of HTML5.

##Relative URLs and the <base> tag While not HTML5 specific, IE has a bug when dealing with the <base> tag, in that it wont work out of the box. Relative URLs will not automatically be rewritten according to the base tag. In order to get it to work as expected, insert this script into the <head> of your page:

<base href="/">        
    <!--[if IE]><script type="text/javascript">
        // Fix for IE ignoring relative base tags.
        // See http://stackoverflow.com/questions/3926197/html-base-tag-and-local-folder-path-with-internet-explorer
        (function() {
            var baseTag = document.getElementsByTagName('base')[0];
            baseTag.href = baseTag.href;
        })();
    </script><![endif]-->   
    <!-- this relative css path include should now work -->

##IE and HTML5 IE8 especially has little or no support for HTML5. If you want to use HTML5 and still support IE8, you have to use the html5shim, a Javascript file that handles the HTML5 api so the browser doesn't have to. Just put the script in the <head> and set it for IE8 or lower:

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

##@media: Media Queries and IE If you are using @media in your pages, older versions of IE will not like you. Bootstrap uses @media to handle its layout, by the way. You can add this JS file to your page in the same way that you added the html5shim to fix this issue:

https://raw.githubusercontent.com/livingston/css3-mediaqueries-js/master/css3-mediaqueries.js

##Resources

Add a custom footer
⚠️ **GitHub.com Fallback** ⚠️