css - Using border-image properly -


i'm trying implement border-image property in div have created, leaf image (http://imageshack.us/photo/my-images/703/leafy.png/) go around edge of div.

i have attempted cannot leaves normal , seem overlap in corners, find border-image property confusing , frustrating, can point me in right direction!

the code using here: jsfiddle.net/mqrd6/

and trying achieve (roughly) here: http://imageshack.us/a/img203/1029/concepto.png

also know ie (as usual) doesn't support border-image property, there workaround this? using javascript or something?

really appreciate :)

you try this: http://jsfiddle.net/mqrd6/3/

the trick set width of border-image same border-width:

#leaf {     width: 760px;     vertical-align: middle;     border-width: 22px;     border-image: url(http://img703.imageshack.us/img703/4976/leafy.png) 22 22 round; } 

no versions of ie supports border-image. give support in ie try css3pie, simple library allows use several css3 features in ie6 or higher.


Popular posts from this blog

How to calculate SNR of signals in MATLAB? -

c# - Attempting to upload to FTP: System.Net.WebException: System error -

ios - UISlider customization: how to properly add shadow to custom knob image -