html - Bootstrap 中行内的多列在 IE 11 中不起作用

标签 html css twitter-bootstrap

这是我的 Bootstrap HTML 代码片段。它在除 IE-11 之外的所有浏览器中都能正常工作。我收到一个水平滚动条,一行中的最后 2 个 div col-xs-6 出现在 2 个不同的行中,而不是在一行中。

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Bootstrap Example</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/bootstrap.min.css">

    <script src="javascript/bootstrap.min.js"></script>
  </head>
  <body>

    <div class="container">
      <div class="row" style="background-color:yellow;">
        <div class="col-xs-12" style="background-color:aqua;">col-xs-12 inside a row</div>
      </div>
    </div>                      
    <div class="container">
      <div class="row" style="background-color:yellow;">   direct inside a row
      </div>
    </div>      
    <div class="container">
      <div class="row" style="background-color:yellow;">
        <div class="col-xs-6" style="background-color:red;">col-xs-6 inside a row</div>
        <div class="col-xs-6" style="background-color:orange;">col-xs-6 inside a row</div>
      </div>
    </div>

  </body>
</html>

感谢您提前提供的帮助。

最佳答案

您可以尝试在文档标题中指定兼容模式:

<meta http-equiv="X-UA-Compatible" content="IE=11" />

查看此链接以获取更多信息:

IE legacy document modes

关于html - Bootstrap 中行内的多列在 IE 11 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30748970/

相关文章:

javascript - 如何洗牌兄弟 div 但保持子元素相同的顺序

html - 用 HTML 和 CSS 创建一个足球场

html - 在固定高度/可变宽度容器内居中可变宽度/高度图像

twitter-bootstrap - twitter bootstrap 覆盖和自定义样式

html - 使用 Bootstrap 从右到左的列

twitter-bootstrap - 重置/更改 Bootstrap 词缀的偏移量

HTML 元描述 + &

html - 下拉菜单不显示

javascript - Highslide:如何使画廊直接在页面中工作,而不是在弹出窗口或模态窗口中工作?

python - 如何使用 CSS 设置 CGI python 的样式?