CODEWITHSUNDEEP
twitter-bootstraptwitter-bootstrap-3
caffeine_inquisitor
caffeine_inquisitor

Reputation: 727

Bootstrap 3 glyph causes IE8 to crash

I have the following simple HTML with bootstrap 3:

<!doctype html>
<html>
<head>
 <meta http-equiv="X-UA-Compatible" content="IE=edge" >
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="js/lib/jquery/jquery-1.10.2.js"></script>
    <script src="js/lib/bootstrap/js/bootstrap.js"></script>
    <link rel="stylesheet" href="js/lib/bootstrap/css/bootstrap.min.css" media="screen"/>
</head>
<body>

<div class="container">
<div class="row">
        <div class="col-md-5">
            <button type="button" class="btn btn-default btn-lg">
               <span class="glyphicon glyphicon-arrow-left"></span>Back
             </button>
        </div>
</div>
</div>
</body>
</html>

which works fine when I tried to open it on my PC. But when I deployed it to the server (AIX), IE8 just crashed, and reload the page again - and it was ok after reloading the page.

I then figured out that the culprit is the glyph:

<span class="glyphicon glyphicon-arrow-left"></span>

especially the glyphicon-arrow-left.

Moreover, if I place the entire button outside the container:

<body>      
       <button type="button" class="btn btn-default btn-lg">
       <span class="glyphicon glyphicon-arrow-left"></span>Back</button>
</body>

then it will not crash either. So it seems that it is the combination of glyph being placed inside the container (and row) that causes IE8 to crash.

Have I done something silly here? Am I missing something so obvious?

Thanks in advance!

Regards,

Alex

Upvotes: 0

Views: 355

Answers (1)

caffeine_inquisitor
caffeine_inquisitor

Reputation: 727

Ok...here is what I found:

  1. I obviously forgot to include HTML5shiv & Respondjs. Those are required for IE8.

  2. I have to put those 2 (html5shiv & respondjs) to be loaded after the bootstrap css file. For me, IE8 still crashes if I put them before the bootstrap css.

Upvotes: 2

Related Questions