IE7的position:relative bug
今天遇到了一个相对定位(position:relaitve)引起的IE7中overflow:hidden失效的bug,特此记录!解决方法很简单,给父层(div#scroll)设置position:relative就OK了。
XHTML结构:
<div />
</a>
</div>
CSS样式:
#scroll{
position:relative;
width:500px;
overflow:hidden;
padding-top:14px;
white-space:nowrap;
}
#scroll a{
position:relative;
display:inline-block;
overflow:hidden;
padding:08px;
color:#636361;
text-align:center;
}
#scroll img{
width:84px;
height:84px;
}
#scroll span{
display:block;
width:84px;
padding-top:8px;
white-space:nowrap;
text-overflow:ellipsis;
}
#scroll a:hover{color:#FFF;}
#scroll.border{
position:absolute;
left:8px;
top:0;
}
#scroll a:hover .border{display:none;}
这个bug存在于IE7中,当div#scroll中的a设置position:relative;时,div#scroll的内容超过本身width时,div#scroll在IE7中会出现异常,具体表现为overflow:hidden失效,另外还会导致JS实现的图片滚动在IE7中失效。
解决方法很简单,给父层(div#scroll)设置position:relative。

 

 

by:http://hi.baidu.com/luoxiandong99/item/5b9e31ecdbe9141a560f1d5c

相关文章:

  • 2022-02-02
  • 2021-10-16
  • 2021-07-05
  • 2021-10-31
  • 2021-08-19
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-12-25
  • 2021-12-09
  • 2021-09-25
  • 2022-12-23
  • 2021-06-04
相关资源
相似解决方案