如何防止覆盖边框图像的背景图像

我正在尝试将一个衣衫褴褛的寄宿生添加到羊皮纸背景中。这是我的CSS如何防止覆盖边框图像的背景图像

#wrap 
{ 
    width:52em; 
    margin:30px auto; /* centers the container */ 
    background-image: url(../images/parchment.gif); 
} 
.borderimage #wrap 
{ 
    border-width: 10px; 
    -chrome-border-image: url(../images/parchment_border.png) 10 10 10 10 repeat; 
    -moz-border-image: url(../images/parchment_border.png) 10 10 10 10 repeat; 
    -o-border-image: url(../images/parchment_border.png) 10 10 10 10 repeat; 
    -webkit-border-image: url(../images/parchment_border.png) 10 10 10 10 repeat; 
    border-image: url(../images/parchment_border.png) 10 10 10 10 repeat; 
}

.borderimage类是modernizr的一部分。

渲染时，背景图像覆盖寄宿图像。如果我将背景图像设置为无，我会在边框处看到边框图像。几年前，我做了这个工作，但是它在一段时间之前失败了。如果是因为我所做的更改或浏览器升级，我不会。网络搜索没有发现任何有用的东西。

来源

2013-04-04 curt

试着把background-size: contain;放在#wrap内

来源

2013-04-04 03:54:29 Zendy

它没有影响。 – curt 2013-04-04 15:52:50

你是否也重复背景？ – Zendy 2013-04-04 23:13:23

我没有指定重复，但它必须作为包装部门可以很长。我原来的modernizr css将背景图像设置为none。我认为这曾经是因为边框图像填充了中心和背景图像不需要。现在边框图像仅显示在边框中。 – curt 2013-04-04 23:32:33

如何防止覆盖边框图像的背景图像

回答

相关问题