软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > Web前端 > 工具与技巧 > IE与火狐对百分比宽度解析的细小差异

IE与火狐对百分比宽度解析的细小差异

  烈火网(LieHuo.Net)教程 IE与firefox对百分比宽度解析存在细小差异,假设一个DIV宽度800px。里面有8个字DIV等宽依次浮动,可以这么写。

以下为引用的内容:
.out{width:777px;}
.out .in{width:12.5%; height:20px; float:left;}

  html代码:

以下为引用的内容:
<div class="out">
<div class="in"></div><div class="in"></div><div class="in"></div><div class="in"></div><div class="in"></div><div class="in"></div><div class="in"></div><div class="in"></div>
</div>

  照我们的理解:12.5% * 8正好为100%嘛!所以内部8个DIV的宽度一起浮动总宽度应该正好等于外部DIV的宽度的。

  ok,想法毕竟是想法,而事实上:火狐下是这样子,但是IE,不好意思,不是这样的。

  这里我没有计算,数据或许有不准,但是原理是实践过滴。

  IE算百分比的时候完全取整的。

  777px*12.5%=97.125

  IE会取整,于是为97px,8个累加就是776px,结果总长少了1px。

  同样的,如果外部DIV宽度为772,则

  772 * 12.5%=96.5px,取97px,结果776px,总长长了4px。

  这是我在写自适应页面时遇到的一个比较头疼的问题。问题原因是知道了,如何解决还没有想到很好的方法。

  firefox下表现很好。IE,叹息!

  (完)

    相关阅读
    网友评论
    栏目导航
    推荐软件