WP即页脚不在底部

Question

我有一个麻烦，在诺基亚lumia 520上，即我的页面底部没有我的页脚，但在其他ios上，Android设备都可以。

为什么在“移动”中，即我有这样的麻烦？

<div class="page-wrap"> 
</div>
<footer>
</footer>

和css：

html, body{
  height: 100%;
  min-height: 100%;
}

.page-wrap{
  min-height: 100%;
  margin-bottom: -70px;
  overflow: auto;
  background: green;
}

.page-wrap:after{
  content: "";
  display: block;
}

footer{
  width: 100%;
  height: 50px;
  padding: 20px 0 0 0;
  background: #577abd;
}

@-ms-viewport{width:auto!important;height:320px!important}  //or even without this line

小提琴：

http://jsfiddle.net/pmp01rt4/

Answer 1

我尝试使用Internet Explorer 11仿真（按F12）和我的Lumia 1520（下面的屏幕截图）。我没有看到它的问题。

但是，我会建议以下内容，根据我的经验，在移动浏览器上可以更可靠地运行：

article{
  position:fixed;
  top:0;
  left:0;
  height:calc(100vh - 50px);
  width:100vw;
  background: green;
}

footer{
  position:fixed;
  bottom:0;
  left:0;
  width: 100vw;
  height: 50px;
  padding: 20px 0 0 0;
  background: #577abd;
}

<article></article>
<footer></footer>