CSS border-image-outset Property

Description

The border-image-outset property specifies the amount by which the border image area extends beyond the border box. If it has four values, they set the outsets on the top, right, bottom and left sides in that order. If the left is missing, it is the same as the right; if the bottom is missing, it is the same as the top; if the right is missing, it is the same as the top.

  • Initial value0
  • Applies toAll elements
  • InheritedNo
  • MediaVisual
  • Computed valueFour values, each a number or <length> made absolute
  • AnimatableNo
  • CSS VersionCSS3
  • JavaScript syntaxobject.style.borderImageOutset

Syntax

Formal syntax: [ <length> | <number> ]{1,4}

border-image-outset: <length>;
border-image-outset: <number>;

Values

  • <length>Floating-point number, followed by an absolute units designator (cm, mm, in, pt, or pc) or a relative units designator (em, ex, or px). Negative numbers are not allowed.
  • <number>Represents a multiple of the corresponding border-width. Negative values are not allowed for any of the 'border-image-outset' values.

Example

.class {
   border-image-outset: 10% 15%;
}

Browser Support

?Firefox?Explorer?Chrome?Safari?Opera

Last updated on 23rd March 2014 By Rene Spronk

View All CSS Properties

Errors? Please help to keep this list up to date, If you find any errors, please contact us, so that we can get them fixed.