IE8 Bootstrap Respond.JS，列表项不水平答案

【问题标题】：IE8 Bootstrap Respond.JS, List Items Not HorizontalIE8 Bootstrap Respond.JS，列表项不水平
【发布时间】：2014-12-04 19:48:47
【问题描述】：

我在引导程序中遇到 dl-Horizontal 类的问题。

我的行上有两列，每列中有一个 dl 列表。在除 IE 8 之外的所有浏览器中，列表项 () 和列表值 () 彼此相邻，然后下一个项值对位于下一行。但是在 IE8 中，该项目的值出现在彼此下方，并且两列彼此下方。

感谢您的宝贵时间。

Fiddle Example

 <link href="<%=ResolveUrl("~/Extern/JQuery/BootStrap/bootstrap-3.2.0/dist/css/bootstrap.min.css")%>" rel="stylesheet" />
    <script src="<%=ResolveUrl("~/Extern/JQuery/Jquerylibs/Jquery1-11/jquery1-11-0.js")%>" type="text/javascript"></script>
    <script src="<%=ResolveUrl("~/Extern/JQuery/BootStrap/bootstrap-3.2.0/dist/js/bootstrap.min.js")%>" type="text/javascript"></script>

     <!--[if lt IE 9]>
         <script src="<%=ResolveUrl("~/Extern/JQuery/html5Siv/html5shiv-master/dist/html5shiv.min.js")%>" type="text/javascript"></script>
        <script src="<%=ResolveUrl("~/Extern/JQuery/Respond-master/dest/respond.min.js")%>" type="text/javascript"></script>
  <![endif]-->  


    <div class="container">
        <div class="row">
              <div id="OnlineEstimate" class="OnlineTabCell">
                 <div class="col-6 col-sm-6 col-lg-5">
                      <dl class="dl-horizontal"> 
                          <dt>Make:</dt><dd><div id="DetMake">aaa</div></dd> 
                          <dt>Model:</dt><dd><div id="DetModel">bbb</div></dd> 
                          <dt>Derivative:</dt><dd><div id="DetDerivative">ccc</div></dd> 
                          <dt>VIN:</dt><dd><div id="DetVin">ddd</div></dd> 
                           <dt>REG:</dt><dd><div id="DetReg">eee</div></dd> 
                          <dt>Colour:</dt><dd><div id="DetMileage">fff</div></dd>
                          <dt>Mileage:</dt><dd><div id="DetColour">ggg</div></dd>
                          <dt>Account:</dt><dd><div id="DetAccount">hhh</div></dd>
                          <dt>Customer No:</dt><dd><div id="DetCustNo">iii</div></dd>
                      </dl> 
                    </div>
                   <div class="col-6 col-sm-6 col-lg-6">
                      <dl class="dl-horizontal"> 
                          <dt>Address:</dt><dd><div id="DetAdd1">aaa</div></dd> 
                          <dt></dt><dd><div id="DetAdd2">bbb</div></dd> 
                          <dt></dt><dd><div id="DetAdd3">ccc</div></dd> 
                          <dt></dt><dd><div id="DetAdd4">ddd</div></dd> 
                           <dt></dt><dd><div id="DetTown">eee</div></dd> 
                          <dt></dt><dd><div id="DetCounty">fff</div></dd>
                          <dt>Postcode:</dt><dd><div id="DetPostcode"></div></dd>

                      </dl> 
                    </div>

            </div>
        </div>
         </div>

下面的链接是我用来测试IE 8模式的小提琴全页模式！

Fiddle Full page mode

问候

汤姆

【问题讨论】：

请在您的问题中描述“不起作用”和“此问题”的含义。我们并不是所有的 IE8 都可用于演示目的。
如果您在 IE 中查看整页小提琴链接，单击开发人员工具可以将版本放入 IE8 模式。我有两个组，制造模型组和地址组。品牌/型号组应在屏幕左侧，地址组在右侧。在 IE 8 中，一切都在彼此之下。所以你有 Make: 然后在下面你有 aaa 后跟 Model: 等
在问题中，请。您还可以使您的标题更具描述性。
你不解释什么不起作用，可能是省略号，IE8不支持，你可以使用-ms-text-overflow属性

标签： jquery css twitter-bootstrap twitter-bootstrap-3 respond.js

【解决方案1】：

问题是由于 javascript 库被放置在页面主体而不是页面头部引起的。

【讨论】：