Javascript 背景图像div周围不需要的边框

我的背景图像周围有一条细线或边框。我通过javascript动态更改父div的高度，以便内部div（设置了背景图像）将“粘贴”到窗口底部

桌面浏览器上不显示任何线条，但在脚本运行后的移动浏览器上，其周围通常有一个细边框：

边界在左边，它应该在右边。有什么建议吗

以下是脚本：

<script type="text/javascript">
function layoutHandler(){
    if(window.innerHeight > 1061){
    var newsize = 150 + (window.innerHeight - 1061);

        document.getElementById("footerwrapper").style.height = newsize+'px';
    }
    else {
        document.getElementById("footerwrapper").style.height = '150px';
    }
}
window.onload = layoutHandler;

window.onresize = layoutHandler;
layoutHandler();
</script>

编辑：

---

好的，在测试了更多之后，当它发生时，我缩小了范围。（这可能会让人沮丧地具体化）这种情况最明显地发生在iPad的纵向模式上。我关掉了“repeat-x”，它就完全消失了。这让我尝试了一个更宽的背景图像，它不会在iPad的宽度范围内重复，并且解决了这个问题。你知道为什么会这样吗

我也遇到了同样的问题，移除

repeat-x

解决了这个问题。我认为这是手机浏览器的缺陷。

您是否尝试过显式设置

边框：0在css中？是的，它没有效果。grad.png图像是150px吗？也许把它做得比顶端需要的高一点。@markle976我试试。现在是150px。您的
页脚包装器的
背景色是什么（我假设
内部的
？是不是从脚本中计算出的高度为150px，并显示了页脚包装的背景？对于嵌套在其中的整个结构，进一步使用html和css可能有助于解决这个问题。
#inner {
    background-color: #FFF;
    padding: 0px;
    height: 150px;
    bottom: 0px;
    width: 100%;
    position: absolute;
    background-image: url(Images/grad.png);
    background-repeat: repeat-x;
}