Ie8 Issue With Twitter Bootstrap 3

IE8 issue with Twitter Bootstrap 3

You got your CSS from CDN (bootstrapcdn.com) respond.js only works for local files. So try your website on IE8 with a local copy of bootstrap.css. Or read: CDN/X-Domain Setup

Note See also: https://github.com/scottjehl/Respond/pull/206

Update:

Please read: http://getbootstrap.com/getting-started/#support

In addition, Internet Explorer 8 requires the use of respond.js to enable media query support.

See also: https://github.com/scottjehl/Respond

For this reason the basic template contains these lines in the head section:

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="../../assets/js/html5shiv.js"></script>
  <script src="../../assets/js/respond.min.js"></script>
<![endif]-->

Bootstrap 3 Not Working in IE8

You need to change this:

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->

To something like this (using whatever is the relative path for your site):

<!--[if lt IE 9]>
<script src="/path/to/your/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="/path/to/your/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->

Twitter Bootstrap examples not working in IE8

The copy of your bootstrap CSS must be hosted locally, the CDN stuff does not.

http://app.crossbrowsertesting.com/public/i82cbc31d6d6bc2e/livetests/1245371/snapshots/zc8cbc63e8e0c6b6fce2

Also, your justified-nav.css appears to be an html file when I click on it on view source.

Copy of same file, same problems until I hosted the css directly.

http://badasstheme.com/test-justified.html

BOOTSTRAP'S DOCS:

Respond.js and cross-domain CSS

Using Respond.js with CSS hosted on a different (sub)domain (for
example, on a CDN) requires some additional setup. See the Respond.js
docs for details.

IE8 issue with Bootstrap 3 and testing in IE emulation modes

Delete this file : bootstrap/js/ie-emulation-modes-warning.js

Or just remove this line in your HTML template :

<script src="bootstrap/js/ie-emulation-modes-warning.js"></script>

bootstrap 3 grid layout not working in IE8

The problem it appears is using the wrong class for the grids. Even though the screen size of my Windows system was larger than my Mac book's, I made the wrong assumption that the resolution would be the same or higher.

I had developed my site on the mac, and used .col-md- classes for the grid layout. However, since the resolution of my Win device was lower, .col-xs- should have been used. And hence, it was appearing stacked.

Lesson: Even though your Win system might have a larger screen, it's resolution can be as low as that of a tablet.

---

Related Topics