Category: Web

Web

Add support for IE8 to bootstrap

Posted on by johnytables

I needed to make Bootstrap 3 work with old IE8 browsers, so the necessary steps are:

Add the following to the <head>

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="js/html5shiv.min.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>

If these lines are not present, respond.js will not work

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

You also need to load respond.js from the same domain as the bootstrap.css

And also, make sure you’re using jQuery from the 1.x branch, the only that has IE8 support.

If you’re like me and are running Windows 10, then you can no longer test your site using Edge, so you can download an IE8 VM from Microsoft available here:

https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/

0