CSS border-image-slice property


CSS border-image-slice specifies the inward offset from the top, right, bottom, and left sides of the image. The image is divided into nine parts( 4 corners, 4 edges, 1 middle part). But the middle part is transparent.

There are four values that specify the offset of the top, right, bottom, and left edges of the image.


border-image-slice : +ve number | +ve percentage

Property values

+ve percentageDefault

It is relative to the dimensions of the images. horizontal offset is relative to the width and vertical offset is relative to the height of the image.

border-image-width: 100%;

+ve number

This number represents the pixels of image or coordinates.

border-image-width: 14;

Applicable to

It applies to all elements except the table with border-collapse: collapse;.

#CSS digger
Was this article helpful?