在Internet Explorer中引导3个问题。

时间:2023-01-17 08:12:05

My html is as

我的html

<div class="container">    
    <div class="row">
        <div class="col-lg-6" >
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
        </div>
        <div class="col-lg-4" >
            <img class="img-responsive " src="images/image1.png"></img>
        </div>
    </div>
</div>

This works perfectly in chrome and firefox, both the div inside row class come side by side, i get text on left side and image on the right. But when tested on Internet Explorer (ie8) the div with class col-lg-6 takes the entire width of the screen and so is the div with class col-lg-4.

这在chrome和firefox中工作得很好,row类中的div都是并排的,左边是文本,右边是图像。但是,在ie (ie8)上测试时,具有coll -lg-6类的div占据了整个屏幕的宽度,而具有coll -lg-4类的div也占据了整个屏幕的宽度。

The style width:60% or so in percentage seems not to be recognized by Internet Explorer. But I have not defined the container width anywhere explicitly. In bootstrap.css it takes up automatically for each size.

样式宽度:60%左右的百分比似乎不能被Internet Explorer识别。但是我还没有在任何地方显式地定义容器宽度。在引导。css它会自动地占用每个大小。

How can I get this working on Internet Explorer properly. thanks.

如何让这个在Internet Explorer上正常工作。谢谢。

2 个解决方案

#1


1  

Already its too late to reply to this question. Now only i came with this issue. For me it solved. Try using:

现在回答这个问题已经太晚了。现在只有我提出这个问题。对我来说,解决。尝试使用:

add .col-xs-12 to your responsive image.

在您的响应图像中添加. colx -12。

Check the link http://www.bootply.com/116378

检查这个链接http://www.bootply.com/116378

#2


3  

try use this in head section

试着在标题部分使用这个

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[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]-->

#1


1  

Already its too late to reply to this question. Now only i came with this issue. For me it solved. Try using:

现在回答这个问题已经太晚了。现在只有我提出这个问题。对我来说,解决。尝试使用:

add .col-xs-12 to your responsive image.

在您的响应图像中添加. colx -12。

Check the link http://www.bootply.com/116378

检查这个链接http://www.bootply.com/116378

#2


3  

try use this in head section

试着在标题部分使用这个

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[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]-->