image in border of a div

is it possible

[mchristine]

is it possible to use an image in a border of a div instead of a style, width and color. I've seen it in css3, but I think I saw that somewhere in css2 and can't remember where.

Can you help?

Thanks

[Don_Hoagie]

hmm... i've never heard of doing that with a border. I know it can be mimicked though; i've done it before with underlines... but part of the concept is that you use {background-repeat: repeat-x}... that's what gives it the look of an underline (or bottom border, in this case). Getting rid of the background-repeat style would make it a plain ol' repeating background image.

May i suggest you do it this way...

create a div with a background image (the one you want as a border, making sure that the edges of the image are what you want to be viewable)

create another div with a higher z-index on top of that div, and color it with, say, the same background color as the rest of your page, but make its size and orientation so that it shows the underlying div on all four sides.

.borderimage {
position: absolute;
top: 0;
left: 0;
width: 400px;
height: 100px;
background-image: url(image.jpg);
}

.contentarea {
position: absolute;
top: 10;
left: 10;
width: 380px;
height: 80px;
background-color: white;
z-index: 99;
}

[dcrombie]

There is a CSS3 property for this but AFAIK it's only supported in the latest Safari build and no other browsers.