Html 页脚不在窗口底部，（phonegap jquery mobile app for windows mobile）

我正在使用jquery和phonegap开发一个windows mobile应用程序。我已经把应用程序的页脚

            <div class="footer" ></div>

---

它正确地显示在IE浏览器中。但它是从窗口底部向上显示在模拟器中的

问题用jquery mobile标记。所以我假设您使用的是jQuery mobile

为什么不使用jquerymobilebooter

然后通过添加数据position=fixed属性，即。e

<div data-role="footer" data-position="fixed">
    <h1>Fixed Footer!</h1>
</div>

---

在此处查找更多信息：

如果data position=fixed不起作用，请从页脚div中删除data position=fixed并尝试以下操作：

.ui-footer{
    bottom: 0px; 
    left: 0px; 
    z-index: 10000; 
    width: 100%; 
    height: 2.5em; 
    position: fixed; 
    margin-bottom: 0px;
}

---

也可以尝试添加！重要提示：bottom，margin bottom

将元素固定在PhoneGap应用程序Windows Phone的纵向视图最底部的问题在于，默认情况下，浏览器控件将为地址栏留出一个空白空间，而不考虑bottom:0px CSS属性

在左右查看解决方案后，我成功地使用媒体查询和-ms viewport规则，在纵向和横向模式下将我的页脚置于屏幕的最底部，如下所示：

@media screen and (min-width: 320px) and (orientation:portrait) {
  @-ms-viewport       { width: 320px!important; height:device-heigth!important; }
}
@media screen and (min-height: 320px) and (orientation:landscape) {
  @-ms-viewport       { width:auto!important; height:320px!important; }
}

在纵向模式下，实际使页脚向下移动的更改是设置heigth:deviceheight！重要的但是，这样做显然会使其他默认视口设置无效，从而导致页面上的任何文本看起来都非常小。为了使文本可读，您还必须显式设置宽度，在上面的示例中，我将宽度设置为320px，您可以选择适合您的设置

.footer{
        bottom:0px !important;
        position:absolute !important;
        width:100% !important;
 }

---

这修复了我在Windows Phone 8上的页脚问题。现在它在页面底部

这是什么问题。哦，我的上帝。是否要共享CSS？我的应用程序的页脚不在最底部，仅在Windows phone Emulator上。@Tomasz Janczuk提供的解决方案运行良好。然而，它不能在真实设备上工作，只能在模拟器上工作。多亏有了javascript，当键盘向下聚焦时，将位置更改为固定。