internet explorer, modernizr.js, respond.js, html5shiv.js, ie-7.js compatibility

3.6k views Asked by At

I have updated my code to latest Twitter Bootstrap v3, and it has dropped support for older (ie7 or less) browsers, even ie8 / ie9 are not fully supported, so I am trying to use some third party plugin / scripts so I don't have to write IE specific css unless it's critical or necessary (not worried about css3 shadows, rounded corners etc).

modernizr.js I will be using this, respond.js (I think I will be using it as well for media queries support in older browsers)

now tell me if modernizr.js and respond.js can work together

also

I think *html5shiv.js is not required as modernizr.js covers it (tell me if it does)? and also can I load alongside respond.js if modernizr.js doesn't provide html5 enhancement?

tell me if I still need to use ie9.js? if yes with which combination?

As I want

a) Media queries support b) Browser detection for css3 features support (which modernizr.js does well) c) Would like my website(s) to work in IE browsers (not worried about shadows, rounded corners etc, just bug's layout, float, etc)

so help me with this situation, oh and I also use

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en-US"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en-US"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en-US"> <!--<![endif]-->
<!--<html class="js">-->
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

so tell me I need to do something with these as well to achieve my desired result (specially chrome-1 should I be using it?

Thanks

*UPDATE:* Since I asked this question, I am using this approach, I am using custom modernizr build without html5shiv, and I dropped ie7.js tried ie9.js same results (found it v. buggy instead of helping was causing issues), using respond.js and separate html5shiv and it has been working for me fine since.

Now I also use this tag, <meta http-equiv="X-UA-Compatible" content="IE=edge" /> dropped chrome=1

0

There are 0 answers