border gradient in chrome

You sent c开发者_高级运维ode border gradients which is running in mozilla. But it is not working in webkit browser. Can you tell me the code that is runnable in webkit browser for border gradients?

Gradients for border images are currently not working correctly in -webkit. In fact, only basic border-image support via the border-image shortcut syntax is working in Webkit browsers. You will need to hack together using nested divs.

You might consider using a parent div with a padding of the width you want the border to have and then just set the parent div's background to:

-webkit-gradient(linear, left top, left bottom, from(white), to(black));

You don't have to do that:

-webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;

Will do the job for you. Check out http://jsfiddle.net/MWaTw/ for more examples