用bootstrap 3和IE8响应.js

Question

在 Inernet Explorer 8 有人可以告诉我为什么services page上的列宽比它们应该的短吗？它们应与下面的黄色突出显示区域类似：

我尝试在浏览器堆栈中查看它并使用IE11中的仿真模式。我正在使用 respond.js ，如Bootstrap docs中所述。

我做错了什么？

由于

Answer 1

IE8中存在两个问题：

第一个问题：

<dt>
    <i class="icon-data-consolidation"></i>
</dt>

此<dt>标记在IE8上的大小与其他任何浏览器不同。 （Firefox，Chrome，Safari等）。例如，在Mozilla中它有width = 45px ; height = 45px，而在IE8中它有width = 160px ; height = 45px;。因此，由于页面中<dt>标签的宽度为160px，因此您的设计会崩溃。

第一个问题的解决方案：

将此添加到您的css代码中：

.dl-horizontal dt {
    width: 45px !important;
}

第二个问题：

<dd>
    <h5>Data Consolidation</h5>
    <p>Data from disparate systems ...</p>
</dd>

此<dd>标记在Firefox中有一个margin-left = 45px，但在IE8中它设置为180px。

第二个问题的解决方案：

将此添加到您的css代码中：

.dl-horizontal dd {
    margin-left: 45px !important;
}

我已经对此进行了测试并且有效，希望这会有所帮助。