border-image: workaround for IE

Question

Is there any workaround for IE which makes me able to use border-image? I\'m developing a site and it\'s working properly in every browser but IE. I need to mim

Answer 1

Take a really wide image of that red gradient with the proper 4 corner cutouts, save it as an image (transparent PNG on corners since you are not supporting IE6).

For each of those header areas you will wrap it like so:

ENQUETE

You set this image as background on both of those elements, offset one of them so you can get the image endcaps on both beginning and end. Adjust the spacing/shift until you are clear on both round segments.

.outer {  
    background: transparent url(redgradient.png) no-repeat 0px 0px;  
    margin: 0 10px 0 0;  
}  
.inner {  
    background: transparent url(redgradient.png) no-repeat 100% 0px;  
    position: relative;  
    left: 10px;  
}