-webkit-border-image with css sprites

I use -webkit-border-imageto indicate my main style sprite image. A sprite image is a bunch of button images. What style attributes do I use for indexing in my main sprite image?

.red {
    -webkit-border-image: url(sprite.png) 0 14 0 14;
}

The red sprite button is located at x = 0, y = 21.

What attributes do I use? If it were a background, I would use background-position. I'm not sure what to use for -webkit-border-image.

+3
source share
2 answers

You cannot do this with border-image. According to this , CSS3 will define a new syntax for image slices and image sprites.

+1
source

, . .

:

border-image: url([file]) [offsettop] [offsetright] [offsetbottom] [offsetleft];

border-image . , , ( 10px + border-top-width 10px 10 0 10).

border-width 0px , , . , .

( , ) :

http://alignedleft.com/blog/2010/07/using-css3-border-image-sprites-for-flexible-button-states/comment-page-1/#comment-832

+2

Source: https://habr.com/ru/post/1753448/