1、The IE Doubled Float-margin Bug
在IE/win中显示如下代码其结果是让人愤恨的:
xhtml代码:<div class="floatholder">css代码:
<div class="floatbox">
<div>Float</div>
</div><div style="clear:both;"></div >
</div>
.floatholder{
weith:400px;
height:200px;
}
.floatbox {
background-color:#f00;
float:left;
width:150px;
heith:150px;
margin:5px 0px 5px 50px;
}
解决方法: 在CSS代码.floatbox中加入
display:inline;
2、The IE Escaping Floats Bug
在IE/win中显示如下代码其结果是大部分的浮动物都溢出父层:
xhtml代码:<div class="floatholder">css代码:
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div class="floatbox"> </div>
<div style="clear:both;"> </div>
</div>
.floatholder {
border:2px solid #000;
margin:0 20% 20px 0;
}
.floatbox {
float:left;
width:50px;
height:50px;
margin:2px;
background-color:#bb7;
color:#ffd;
text-align:center;
}
解决方法: 为父层的DIV再加一个Class hollyback
<div class="floatholder hollyback">
在CSS中加入如下代码:
/* hide from IE/win \*/
* html .hollyback {
height:1%;}
/*end hide */
我们可以把所有的IE5.x 集中起来放在一个补丁文件中再用调入这样的话我们就可以集中解决IE5.x 的BUG,而不用一边设计一边修正BUG,也不用把所有的修正内容放在一个文件中,可以加大模块化建设进程。
/* IE5/Win Only Styles作者 / 振之
----------------------------------------------- */
@media tty {
i{content:"\";/*" "*/}} @import url('ie5win.css'); /*";}
}/* */
网站 / 毅博客 http://andy.andymao.com/
电话 / (86)025 5890 9295

