Прозрачность границ изображения для CSS

Question

У меня есть изображение, которое я создал с рамкой CSS.Однако в chrome он не заполняет центр div соответствующим цветом и становится прозрачным.

Когда я помещаю фон в белый цвет, он мешаетпрозрачность границ, поэтому я не мог ее вставить. Есть ли другой способ обойти это (конечно, кросс-браузер)?

#post-wrap {
    margin:auto;
    padding: 0px 40px 70px 40px;
    width: 850px;
    border-width: 96px 17px 15px 36px;
    -moz-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    -webkit-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    -o-border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) 96 17 15 36 repeat;
    border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png)     96 17 15 36 repeat;
}

Answer 1

Вам просто нужно добавить «заливку», чтобы включить фон.

border-image: url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png)     96 17 15 36 fill repeat;

Answer 2

вместо того, чтобы использовать изображение границы, я думаю, что я установил бы это изображение как фон моего div и использовал padding для размещения текста внутри ...

#post-wrap {
    margin: auto;
    padding: 0px 40px 70px 40px;
    background: transparent url(http://www.nicxtay.com/wp-content/uploads/2012/01/postbackground.png) no-repeat top left;
}