页脚在移动设备上更改位置。取决于http / https（herokuapp）

Question

我使用这种页脚，它在localhost上运行正常，但我怎样才能在heroku服务器上修复它？

html {
position: relative;
min-height: 100%;
}

body{
    margin-bottom: 50px;
}

.footer{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px;
    background-color: #222;
}

footer with https和footer with http

或许您可以给我一些建议，如何创建始终位于页面底部的页脚。