Android浏览器忽略位置：绝对

Question

我正在为孩子们开发一个移动网站，但我正在努力安装Android平板电脑。问题是，页脚没有停靠在底部。

这是任何浏览器（桌面）和iPad上的网站：

这是我们Android设备上的网站（Android 4.2.2）：

HTML片段：

<div id="wrapper" class="... stuff ...">
  <div class="center">
    <div id="content"> 
      ... content stuff omitted ...
      <footer id="footer"> 
        <img src="img/bg.svg" alt="" width="100%"> <!-- Footer image -->
        <img src="img/marienkaefer.png" alt="marienkaefer" id="marienkaefer" width="26"> <!-- Flying ladybug relative to the footer -->
        <img src="img/schmetterling.png" alt="schmetterling" id="schmetterling" width="20"> <!-- Flying butterfly relative to the footer -->
      </footer>
    </div>
  </div>
</div>

CSS片段：

#wrapper {
  width:100%;
  height:100%;
  min-width:1024px;
  display:table;
}
.center{
  display:table-cell;
  width:100%;
  height:100%;
  vertical-align:middle;
  text-align:center;
}
#content{
  width:1024px;
  height:652px;
  margin:0 auto;
  position:relative;
  z-index:20;
  overflow:hidden;
  background: url(../img/blurBG.jpg) no-repeat 100% 100% / cover transparent;
}
#footer{
  width: 100%;
  position: absolute;
  bottom: 0;
}
#footer img{
  float:left;
}

为什么这对android不起作用的任何建议？