How to make Bootstrap responsive layout work on IE8

前端 未结 10 1688
醉酒成梦
醉酒成梦 2021-01-31 19:54

I\'ve been search for a while and found some people got it working, but none of them provide any code samples.

I tried their suggestions but it didn\'t work for me. By s

相关标签:
10条回答
  • 2021-01-31 19:56

    yeah it doesn't support IE. i am not anti bootstrap but, I review the css codes of bootstrap framework. and found out that, the other widths are not define as %, i read in other blog article that you should use % for the widths so it will responsive which is true.

    and when it comes to ipad, the css code that is using for this by bootstrap is not came from media query, its just a normal css codes that was not declare inside of media queries. and it is fixed width which is you must use for ie7 & 8. (so think about it first if you want to use bootsrap.)

    in future(or maybe now) when there is a new gadget that the bootstrap not supported. your client might go back to fix that issue.

    we all know that the ie7 & 8 are still existing,so it should have worked on those two old browsers as well.

    so if I were you, create your own framework to meet all the requirements of your site/project.

    but I am not an anti bootstrap, just a thoughts... because I'm developing sites too..

    0 讨论(0)
  • 2021-01-31 19:58

    Your issue is trying to use respond.js with CSS stylesheets that are on external domains. Respond.js will fix media queries for IE6-IE8.

    https://github.com/scottjehl/Respond#cdnx-domain-setup

    Respond.js works by requesting a pristine copy of your CSS via AJAX, so if you host your stylesheets on a CDN (or a subdomain), you'll need to upload a proxy page to enable cross-domain communication.

    See cross-domain/example.html for a demo:

    Upload cross-domain/respond-proxy.html to your external domain
    Upload cross-domain/respond.proxy.gif to your origin domain
    Reference the file(s) via <link /> element(s):
    
    <!-- Respond.js proxy on external server -->
    <link href="http://externalcdn.com/respond-proxy.html" id="respond-proxy" rel="respond-proxy" />
    
    <!-- Respond.js redirect location on local server -->
    <link href="/path/to/respond.proxy.gif" id="respond-redirect" rel="respond-redirect" />
    
    <!-- Respond.js proxy script on local server -->
    <script src="/path/to/respond.proxy.js"></script>
    

    If you are having problems with the cross-domain setup, make sure respond-proxy.html does not have a query string appended to it.

    0 讨论(0)
  • 2021-01-31 20:00

    Quite often people load CSS with media queries (bootstrap and other files) from a Content Delivery Networks (CDN, like oss.maxcdn.com or cdnjs.cloudflare.com). Respond.js doesn't work with externally loaded CSS, so you have to load your Bootstrap CSS (or other CSS with media queries) from your server.

    0 讨论(0)
  • 2021-01-31 20:06

    According to: https://drupal.org/node/2173441

    To have your Bootstrap site working on IE8 you have to follow this steps:

    1. Install Respond.js files using Respond.js Module.
    2. Disable any CDN to load Bootstrap files.
    3. Install Bootstrap files locally using Bootstrap Library Module.
    4. Aggregate and compress CSS files in /admin/config/development/performance
    0 讨论(0)
  • 2021-01-31 20:08

    IE 8 doesn't support media queries out of the box.

    Based on this question and this question, you're going to want to use an extension like css3-mediaqueries-js or Respond.

    0 讨论(0)
  • 2021-01-31 20:11

    Try using html5shiv, its basically a HTML5 IE enabling script and that should get bootstrap working in IE 6,7 and 8. This can also be directly hot linked like this:

    <!--[if lt IE 9]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    

    It must be included before the <body> element (i.e. in the <head>)

    0 讨论(0)
提交回复
热议问题