经常遇到的三种ie6兼容性问题

1、IE6.0关于DIV默认高度的处理
在IE6中,使用CSS定义DIV的高度的时候,当DIV的最小高度小于一定的值以后,无论你怎么设置最小高度,Div的高度会固定在一个值不再发生变动。
<div style="float:right; width:946px; height:8px; background-color:#ededed;"></div>
这是因为在IE6中,系统默认的并非是Div有一个默认的高度,而是你没有解决一个隐藏的参数,font-size,这个是ie6中对于Div属性中的font-size大小和你系统css中定义的font-size有很大关系,因此必须单独定义这个Div的font-size,这样才能解决这个问题。更改后的代码如下。
<div style="float:right; width:946px; height:8px; background-color:#ededed; font-size:0px;"></div>
2、IE6下margin的双倍问题
IE6下的double margin bug,当一个用float浮动的元素,再设定margin-left或者margin-right的时候,IE6会将该值渲染为双倍
此Bug的解决方法:
给浮动元素添加“display:inline”的css样式即可。
3、IE6下 绝对定位元素的 1px 间距 bug
在宽或高为奇数的容器下出现了1px 间距,而在偶数容器下正常。
不完美的解决方法:改变结构并使用浮动
HTML

<div class="fix">
 <div class="outer height199">
  <div class="inner2">img</div>
  <p>This container has a height of 199px</p>
 </div>
 <div class="inner">img</div>
</div>
<div class="fix">
 <div class="outer height200">
  <div class="inner2">img</div>
  <p>This container has a height of 200px</p>
 </div>
 <div class="inner">img</div>
</div>CSS

.fix {
 width:200px;
 margin:10px;
 position:relative;
 float:left;
    display:inline;/* ie double margin fix*/
}
.fix .outer{margin:0}
.fix .inner{
 clear:both;
 margin-top:-30px;
 position:relative;
 float:left;
}
.fix .inner2{float:right;position:static}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值