首页 > 移动平台 > 详细

Android系统overflow失效的BUG

时间:2015-10-16 15:09:13      阅读:263      评论:0      收藏:0      [点我收藏+]

昨天做项目的时候,遇到了一个奇怪的问题。 

问题仅在安卓手机端自带浏览器出现。 用chrome 自适应调试  模拟安卓浏览器时无法重现问题。

安卓手机下用chrome 联机调试又没有问题,仅在安卓自带浏览器内核的情况下才能重现该BUG

这对我的调试十分的不方便。 

这个BUG是这样的:

在父类的prosition:absolute / relative 的时候  父类上如果有overflow属性,overflow属性会失效。

比如 

section{
    position: relative;
    width:100%;
    overflow-x: hidden;
    overflow-y: scroll;
}
section  > div {
    position:absolute;
    left:100%;
    top: 0;
}

 这里的section下的div 在安卓自带浏览器下,还是会溢出,

并且导致页面可以左右滑动。

那么解决办法就是  将 overflow属性  写到div上。

最终解决的代码:

section{
    position: relative;
    width: 100%;
    height: 100%;
}
section > div{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 100%;
    overflow-y: scroll;
}

  这个BUG 挺诡异,特此备案,用以警示。

 

Android系统overflow失效的BUG

原文:http://www.cnblogs.com/wufengjie/p/4885159.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!