css:image in border

I want the border will show an image so for that I used this css w开发者_如何学JAVAhich I got from this site

 border-bottom-image: url('images/header-img.png') 27 27 27 27 stretch stretch; 

But it not worked. I used firebug to see the css but the border-bottom-image is not showing as a part of css in firebug. So can someone please tell me how to use image in border

border-bottom-image is not supported by browsers yet. It's a proposal only.

Edit: 10 months later.

If you also include this helper: http://css3pie.com/documentation/supported-css3-features/#border-image for IE, then support for this if now good enough that it can be used.

make sure that the image path is correct. Right now you have a relative url. You may need to use an absolute path such as /images/header-img.png Notice the leading slash.

You may also need to browser specific declarations:

#header  { -moz-border-bottom-image: url('images/header-img.png') 27 27 27 27 stretch stretch; } /* firefox */
           -webkit-border-bottom-image: url('images/header-img.png') 27 27 27 27 stretch stretch; /* chrome & safari */
           -o-borderbottom-image: url('images/header-img.png') 27 27 27 27 stretch stretch; /* Opera */ }

Source: https://developer.mozilla.org/en/CSS/-moz-border-image