Border Images?

[Hitori]

Hello, I've been trying to learn how to take an image and use it to replace the standard border of something like a <div>. The basic command I've learned is

<border-(insert side left,right,top,bottom)-image>

But I can't find anywhere that will show me a beginner friendly way of using it. Can anyone help me?

[WebJoel]

I think CSS3 will let you use am image for a border. The future is here (-it is just not widely distributed yet...). I do not beleive that any browser supports CSS3 yet..

You could 'fake it' now maybe, by nesting a smaller DIV inside of a larger DIV, leaving ample 'margin' all-'round, and using the "background-image" for the DIV beneith. You likely have to make the 'bottom DIV be "relative" and the smaller, overlying DIV be 'absolute' to pull this off. You could give it a relative-over-relative maybe if you used z-index and positoned to occupy the same space, but you'd be messing with that which creates scrollbars and it gets messy.
<!-- next: background div -->
<div style="position:relative; width:520px; height:520px; border:1px solid black; background-image:url();">

<div style="position:absolute; left:12px; top:12px;width:490px; height:490px; border:3px double red;">
<p>This is the 'inside' div</p>
</div>


</div>

[KDLA]

That's a CSS3 setting. (Not all browsers will be able to display that styling.)
Reference: http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-border-image

KDLA

[KDLA]

Whoops - didn't see your post there, Joel.

Here's a tutorial to fake a border image style (if Joel's doesn't work for you): http://www.bigbaer.com/css_tutorials/css.border.image.frame.styles.htm

KDLA