background-image - 页脚的背景图像跳到屏幕顶部，但页脚内容仍然在底部

Question

我为我的客户的纹身作品集网站做了一个页脚：http: //jessetattoo.com/testing - 它的内容（版权和社交媒体链接）保留在它们应该在的底部，但背景图像粘在顶部页面（红色条）。

这是我的CSS：

#footer{
width: 100%;
height:40px;
background:url(../images/footer-bg.jpg) repeat-x;
bottom:0;
position:relative;
margin-left:-10px;
margin-right:-15px; 

}

我也试过：

#footer{
    min-width: 100%;
    max-width: 100%;
    height:40px;
    background:url(../images/footer-bg.jpg) repeat-x;
    bottom:0;
    position:fixed;
    margin-left:-10px;
    margin-right:-15px; 
}

将位置设置为固定有效，但我希望页脚滚动，而不是粘滞。有一个粘性页脚会很好，但是当在移动设备上查看时，页脚不会保持固定，而是当用户捏拉放大以阅读内容时它会被切断（不幸的是，它不是一个响应式网站）。

任何帮助表示赞赏！提前致谢！