javascript Bootstrap3 col-md-4 和 col-lg-4 在 IE8 上不起作用?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19034773/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap3 col-md-4 and col-lg-4 not working at IE8?
提问by user2796803
I am trying to develop a responsive template using bootstrap3. It is show perfect result for all major browser except IE8. I have created 3 col in a row. But in desktop for IE8 it is only show 1 col in 1 row . That means IE8 shows tab or mobile version on desktop. I have used html5sive.js and respond.js in head section. I have also run bootstrap jumborton example. But the same result. This is the code that is not showing correctly-
我正在尝试使用 bootstrap3 开发响应式模板。对除 IE8 外的所有主流浏览器均显示完美效果。我连续创建了 3 个 col。但是在 IE8 的桌面中,它只在 1 行中显示 1 个列。这意味着 IE8 在桌面上显示选项卡或移动版本。我在 head 部分使用了 html5sive.js 和 respond.js。我还运行了 bootstrap jumborton 示例。但同样的结果。这是未正确显示的代码-
Featured Products
特色产品
<div class="col-sm-4 col-xs-12 col-lg-4 col-md-4 ">
<div class="product">
<div class="product-img ">
<img class="img-responsive" src="img/show1.png" alt="" />
</div>
<div class="row product-description">
<div class="col-md-1 col-sm-1 col-xs-1 col-padding ">
<img class="product-logo" src="img/show1-icon.png" alt="" />
</div>
<div class="col-md-9 col-sm-9 col-xs-12 col-padding col-left-padding">
<h4>Stylish Brown Leather Shoes</h4>
<p><strong>9</strong></p>
</div>
<div class="col-md-2 col-sm-2 col-xs-12 col-padding">
<a href=""><img class="basket" src="img/show-busket.png" alt="" /></a>
</div>
</div>
</div>
</div>
<div class="col-sm-4 col-xs-12 col-lg-4 col-md-4 ">
<div class="product">
<div class="product-img">
<img class="img-responsive" src="img/show2.png" alt="" />
</div>
<div class="row product-description">
<div class="col-md-1 col-sm-1 col-xs-1 col-padding ">
<img class="product-logo" src="img/show2-icon.png" alt="" />
</div>
<div class="col-md-9 col-sm-9 col-xs-12 col-padding col-left-padding">
<h4>Elegant Green Wonderful Shoes</h4>
<p><strong>9</strong></p>
</div>
<div class="col-md-2 col-sm-2 col-xs-12 col-padding">
<a href=""><img class="basket" src="img/show-busket.png" alt="" /></a>
</div>
</div>
</div>
</div>
<div class="col-sm-4 col-xs-12 col-md-4 col-lg-4 ">
<div class="product">
<div class="product-img">
<img class="img-responsive" src="img/show3.png" alt="" />
</div>
<div class="row product-description">
<div class="col-md-1 col-sm-1 col-xs-1 col-padding ">
<img class="product-logo" src="img/show3-icon.png" alt="" />
</div>
<div class="col-md-9 col-sm-9 col-xs-12 col-padding col-left-padding">
<h4>Women Cream and Beautiful Shoes</h4>
<p><strong>9</strong></p>
</div>
<div class="col-md-2 col-sm-2 col-xs-12 col-padding ">
<a href=""><img class="basket" src="img/show-busket.png" alt="" /></a>
</div>
</div>
</div>
</div>
</div>
</div>
回答by Renzo Calla
Im not fan of ie but it seems you have to use the ua-compatible
我不是 ie 的粉丝,但似乎你必须使用ua 兼容的
<meta http-equiv="X-UA-Compatible" content="IE=8,IE=EmulateIE8,IE=7,IE=EmulateIE7" />