CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
gurp
gurp

Reputation: 11

Bootstrap 3 not working in IE 8 even after using respond.js

I've noticed that bootstrap 3 is not working in IE, more specifically the container class isn't working but it works in chrome and firefox. I even added respond.js here is my code

<html>
<head>

<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/style.css">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 8]>
 <script src="js/html5shiv.js"></script>
 <script src="js/respond.min.js"></script>
<![endif]-->

 <link href='http://fonts.googleapis.com/css?family=Oxygen:400,300' rel='stylesheet' type='text/css'>


</head>
<body>

<div id="header" >
    <h1 class="text-center">surrdes</h1>
    <h2 class="text-center info_h1">Simple. Clean. Effective.</h2>
</div>
<div id="first_info">
    <div class="container">
        <h1 class="info_h1">sdfsdfsdfsdfsdfs</h1>
        <p class="d_p">fdsfdsfewfdsfsd</p>
    </div>


</div>
<div id="second_info">
    <div class="container">
        <h1 class="info_h1">fdsfsdfsdfsdfsdfsdfsdf</h1></div>

 </div>


</body>
</html>

What am i doing wrong? I've searched all over the internet still can't get it working.

Upvotes: 0

Views: 2238

Answers (3)

Aron
Aron

Reputation: 3579

I just ran into a similar problem. As it turns out, the minified Bootstrap 3 css does not play nicely with Respond.js 1.4. Instead, you must use an earlier version of Respond.js (1.3 seems to work for me).

Naturally, you must also follow all of the steps set forth in the Bootstrap docs. In short:

  • Use respond js and shiv
  • Use the ie-edge meta
  • Don't use CDN's, just host on the same domain
  • Don't use @import or file://

Here's another description of the bug and short testing markup for it https://gist.github.com/outlast/8602357

Upvotes: 1

Robert vd S
Robert vd S

Reputation: 332

I also had this issue and I noticed that when importing like src="js/respond.min.js it was not able to find the js file gave a 404 on the file. I changed it to src="./js/respond.min.js so starting with ./ with that added it was able to find the file and the div centers.

Upvotes: 0

ThiefMaster
ThiefMaster

Reputation: 318808

<!--[if lt IE 8]> enables the script only for IE7 and older (lt means lower-than). You want <!--[if lt IE 9]> or <!--[if lte IE 8]> instead.

Upvotes: 1

Related Questions