Bootstrap Grid无法在IE8中运行

问题描述 投票:3回答:2

我目前正在设计一个可以在Chrome,FF和IE 9,10上运行良好的网站,但是当我在IE8中通过browserstack查看该网站时,它呈现的非常糟糕。

部分代码:

  <div id="retail_locate" class="container">
        <div class="row">
        <div id="retail_btn" class="col-md-4 text-center hidden-sm hidden-xs">
                    <button type="button" class="btn btn-default"><span class="btn-text">Find A Local Retailer</span><span class="icon-map-marker"></span></button>
                </div>
                <div class="col-lg-8 text-center">
                    <div class="row">
                        <br>
                        <div class="col-md-4 col-sm-4 col-xs-6 ">
                            <img class="img-responsive shadow" src="images/retailers/retail1.jpg">
                        </div>
                        <div class="col-md-4 col-sm-4 col-xs-6">
                            <img class="img-responsive shadow" src="images/retailers/retail2.jpg">
                        </div>
                        <div class="col-md-4 col-sm-4 hidden-xs">
                            <img class="img-responsive shadow" src="images/retailers/retail3.jpg">
                        </div>
                    </div>
                    <br />
                    <div class="row hidden-sm hidden-xs">
                        <div class="col-md-4">
                            <img class="img-responsive shadow" src="images/retailers/retail4.jpg">
                        </div>
                        <div class="col-md-4">
                            <img class="img-responsive shadow" src="images/retailers/retail5.jpg">
                        </div>
                        <div class="col-md-4">
                            <img class="img-responsive shadow" src="images/retailers/retail6.jpg">
                        </div>
                    </div>
                    <br />
                </div>
            </div>
        </div><!-- .container -->

我正在使用Bootstrap 3.我认为搞砸这个是col-lg,md等。网格没有生效。

图片:http://i.imgur.com/qF4ebPJ.png http://i.imgur.com/BzLZBG6.png

任何帮助都会很棒。这是我在Stack上的第一篇文章,我到处寻找修复程序。我在标题中包含了html5shim和respond.js。

 <!--[if lt IE 9]>
     <script src="js/html5shiv/dist/html5shiv.js"></script>
   <script src="js/dest/respond.min.js"></script>
  <![endif]-->

我更改了doctype

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"             "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

甚至添加了元标记

            <meta http-equiv="X-UA-Compatible" content="IE=edge">
javascript html css twitter-bootstrap internet-explorer-8
2个回答
0
投票

IE8不会重新进行媒体查询,这可能就是为什么没有任何工作。我过去使用的代码和工作很棒的是这样的:

https://code.google.com/p/css3-mediaqueries-js/


0
投票

检查非js解决方案:

https://github.com/dizzyn/bootstrap-grid-desktop-first

这是一个网格Css补丁

© www.soinside.com 2019 - 2024. All rights reserved.