Applying a CSS border to an element with -webkit-border-image -
i want able apply gradient border without applying gradient element itself. webkit documentation doing this implies should possible, can't come way of creating black box, gradient border around it. far can tell, bug webkit. here's css:
div { border-width: 10px 10px 10px 10px; width: 75px; height: 75px; background-color:#000; -webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff)) 21 30 30 21; }
if try code , run in chrome or safari, youll see webkit applies border-image gradient entire element rather border. there way accomplish i'm looking css, without using images? thank you!
the border-image
implementation in webkit (and, believe, released browsers) based off 2008 draft of backgrounds , borders module. want currently specced behaviour fill
keyword:
the ‘fill’ keyword, if present, causes middle part of border-image preserved. (by default discarded, i.e., treated empty.)
unfortunately you'll have go solution gareth's until browsers catch spec.
Comments
Post a Comment