背景图片100％固定位置问题

Question

通过将背景图像应用到正文，我使我的网站背景图像拉伸到浏览器窗口的100％宽度和高度，并保持固定位置。此外，我使用此方法创建了也将保持固定的边框：http://css-tricks.com/body-border/

它可以正常工作，你可以在这里看到：http://br-webdesigner.com/test/

唯一的问题是，背景图像是向右伸展到浏览器窗口的边缘，而不是伸展到body元素（或绿色区域）的边界，即使我在html元素上有10px填充

似乎使背景大小100％使得大小100％的浏览器窗口，而不是包含元素。

有没有办法解决这个问题？

谢谢，

Answer 1

所以我尝试使用它来改变你的CSS：

html{

}

body{
 padding:30px;   
background:url(images/bg2.svg) no-repeat fixed;
background-size:100% 100%;
margin:0;
}

.site-border{
background:#352e2e;
z-index:10;
}

#top{
position:fixed;
top:0;
left:0;
width:100%;
height:10px;
}

#bottom{
position:fixed;
bottom:0;
left:0;
width:100%;
height:10px;
}

#left{
    padding:10px;
position:fixed;
left:0;
top:0;
width:10px;
height:100%;
}

#right{
    padding:10px;
position:fixed;
right:0;
top:0;
width:10px;
height:100%;
}