border-image-width
Sets the thickness of the border image. This can be different from the actual 'border-width', allowing you to scale the decorative image pieces independently of the box boundaries.
It is documented as part of the CSS Backgrounds and Borders specification.
Syntax
/* Usage Example */
.thick-frame {
border: 10px solid transparent;
border-image-source: url(';frame.png');
border-image-slice: 30;
/* Makes the border image 20px wide regardless of border-width */
border-image-width: 20px;
}
/* Syntax */
border-image-width: length-percentage;
border-image-width: number;
border-image-width: auto;
/* Global values */
border-image-width: inherit;
border-image-width: initial;
border-image-width: revert;
border-image-width: revert-layer;
border-image-width: unset;border-image-width Browser support
Widely available
Since
2017 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2017.
16+
13+
6+
12+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more