Search code examples
htmlcssbordergradientfill

HTML5: rectangle, counter-directional gradients for fill and border

Is it possible to create a rect, that has gradient fill from black top to white bottom with gradient border from white top to black bottom?

Regards,

Solution

  • It's also hypothetically possible using css gradients for the background-image and border image. I still suck at getting the border-image syntax correct but here's a half-figured out fiddle with a gradient for a border-image: http://jsfiddle.net/y8uFu/

    You can dig through the spec for border-image here: http://www.w3.org/TR/css3-background/#border-images

    I'd love to see if someone can figure it out for the border-image.