Hello everyone.

 

I've been using Bootstrap to create my site, which can be seen here:

 

https://dl.dropboxusercontent.com/u/52725754/fightback-responsive-site/contact-us.html

 

It all seems to be working fine, but when checked in IE8 and IE7, for some unknown reason the size of the container drops from 1170px to 940px.

 

I don't know why it does this. I've tried to use hacks to set the container to 1170px in IE8 and IE7, but then the responsive display doesn't work in IE9 and IE10. I also tried to use a conditional statement in the header to target IE8 and IE7, but the styles were been overridden by the bootstrap css.

 

Has anyone else had this problem or know how to fix it?

 

Thanks

Have a look at respond.js

Thanks for your reply.

 

I tried looking at this, but I couldn't get it to work. I downloaded it and added it to my site, but it didn't work. I took it off as I couldn't get it to work.

Looking at the comments on GitHub the general advice is use respond.js (as above) or just leave it.

 

https://github.com/twitter/bootstrap/issues/2203

 

Rich.

I am having the exact same issue with bootstrap. Wondering if you were able to solve your issue!! or any other suggestions!!

Sorry, but I didn't find a solution to this.

Have you checked in the browser dev tools if the respond.js has loaded on IE8 - 7?

 

Also is it imperative that you support IE-7? the user base for this is now very low and it's hardly worth the trouble. If you're using Bootstrap 3 then that doesn't support IE-7 anyway.

 

Don't forget as well you can use a conditional tag to add a class to the body then you can easily target IE8 in your css:

 

<!--[if lte IE 9]>
   <body class="oldie">
<![endif]-->
<!--[if !IE]><!-->
   <body>
<!--<![endif]-->

 

.oldie .someElement {
  ie8 or less only styling

}

At the place I work we r catering to IE 8 and up. It is working after I applied the conditional tag with !important. Thanks!!