Android系統overflow失效的BUG

標籤：

昨天做項目的時候，遇到了一個奇怪的問題。 

問題僅在安卓手機端內建瀏覽器出現。 用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