在有position: absolute时,overflow:hidden有时失效,有时未失效。
分析后,总结如下:
1. 在absolute(以下为position: absolute简称)层上,若有overflow(以下作为overflow:hidden简称),则不会互相影响,各自功能正常使用。
2. 在absolute层的父级上,如有overflow,则overflow对子级(即absolute层)没有限制作用,不会溢出隐藏。
3. 在absolute层的多层父级以上,若有overflow,而absolute层所能显示的区域是,相对定位的父元素的区域内。
代码例子:
CSS:
<style>
.fl{
float: left;
}
.form{
position: relative;
}
.tips{
position: absolute;
top: 0;
left: 210px;
}
.A{
overflow: hidden;
}
/*.B{
overflow: hidden;
}*/
.clearfix:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}
</style>
Html:
<div class="form A">
<div class="f