ie8中的浮点问题 - 位置和宽度没有解决问题（使用Zurb基金会）

引用全部是：http://smartgridcanadaconf.ca/2013/ 我在ie8中有一个float问题，我无法通过给我的宽度标题 - 我试过玩的位置 - 所以在这一点上 - 这是我的第一个问题在StackOverflow -ie8中的浮点问题 - 位置和宽度没有解决问题（使用Zurb基金会）

* 如何获取标题中的日期行与内嵌的“保存日期“按钮？我有一些CSS来弥补这个要点的问题和评论https://gist.github.com/zurbchris/5068210

我知道我可以使用网格解决 - *

该网站使用的ZURB的基础上，第4版，其特点箱尺寸内置这个问题在一定程度上 - 但是，我想弄清楚当我尝试浮动元素ie8时我还应该寻找什么。

<section class="whiteOut whiteBG row"> 
    <div class="small-12 large-12 columns whiteBG"> 
    <ul id="socialnetworks" class="hide-for-small right"> 

     <li class="icon-linkedin-sign linkedinBtn icon-2x text-center"><a href="http://www.linkedin.com/groups/Smart-Grid-Canada-Conference-4018849?trk=myg_ugrp_ovr"></a></li> 
     <li class="twitterBtn icon-twitter icon-2x text-center"><a href="https://twitter.com/CanadaSmartGrid"></a></li> 
     <li class="mailBtn icon-envelope icon-2x text-center"><a href="maito:[email protected]"></a></li> 
    </ul> 
    <ul id="date"> 
     <li style="width:337px" class="left"> 
     <h2>September 23-25th, 2013</h2> 
     <a href="#"></a> </li> 
     <li style="width:105px" class="left"> <a href="http://smartgridcanadaconf.ca/2013/?attachment_id=78"><span class="saveDate label"><i class="icon-calendar"></i> <span class="hide-for-small">Save to Calendar</span></span></a> </li> 
    </ul> 
    <div class="clear"></div> 
    </div> 
</section>

在此先感谢。

来源

2013-06-28 cameron

这可能太臃肿了一个修复but at the Zurb blog they also mention another way：服务不同版本的基金会。

<!-- Foundation 3 for IE 8 and earlier --> 
<!--[if lt IE 9]> 
    <link rel="stylesheet" href="/css/foundation3/normalize.css"> 
    <link rel="stylesheet" href="/css/foundation3/foundation.css"> 
    <link rel="stylesheet" href="/css/foundation3/app.css"> 
<![endif]--> 
<!-- Foundation 4 for IE 9 and earlier --> 
<!--[if gt IE 8]><!--> 
    <link rel="stylesheet" href="/css/foundation4/normalize.css"> 
    <link rel="stylesheet" href="/css/foundation4/foundation.css"> 
<!--<![endif]-->

而且靠近身体标记之后：

<!-- Foundation 3 for IE 8 and earlier --> 
<!--[if lt IE 9]> 
    <script src="/js/foundation3/foundation.min.js"></script> 
    <script src="/js/foundation3/app.js"></script> 
<![endif]--> 

<!-- Foundation 4 for IE 9 and later --> 
<!--[if gt IE 8]><!--> 
    <script src="/js/foundation4/foundation.min.js"></script> 
    <script> 
    $(document).foundation(); 
    </script> 
<!--<![endif]-->

布局标记只是结合了F4和F3网格类：

<div class="twelve large-12 columns">

来源

2013-06-28 18:21:40 tnog

这将工作 - 但问题解决了通过删除：*， *：之前， *：之后{ -moz-box-sizing：border-box; -webkit-box-sizing：border-box; box-sizing：border-box; } – cameron

盒大小调整是一个明显的问题ie8 - 但我在Safari中也遇到了问题。问题解决了通过CSS删除...：

*, 
*:before, 
*:after { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box; }

这也解决了FREETILEjs的故障 - 这是不是在Safari工作，在所有浏览器加载缓慢。

来源

2013-12-06 17:50:37 cameron

ie8中的浮点问题 - 位置和宽度没有解决问题（使用Zurb基金会）

回答

相关问题