border-image-outset

Summary

The border-image-outset property describes, by which amount the border image area extends beyond the border box.

  • Initial value 0s
  • Applies to all elements, except internal table elements when border-collapse is collapse
  • Inherited no
  • Media visual
  • Computed value all lengths made absolute, otherwise as specified
  • Animatable no
  • Canonical order the unique non-ambiguous order defined by the formal grammar

Syntax

Formal syntax: [ <length> | <number> ]{1,4}
border-image-outset: sides                  /* One-value syntax   */  E.g. border-image-outset: 30%; 
border-image-outset: vertical horizontal    /* Two-value syntax   */  E.g. border-image-outset: 10% 30%; 
border-image-outset: top vertical bottom    /* Three-value syntax */  E.g. border-image-outset: 30px 30% 45px; 
border-image-outset: top right bottom left  /* Four-value syntax  */  E.g. border-image-outset: 7px 12px 14px 5px;

border-image-repeat: inherit

Values

sides
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box in all four directions.
horizontal
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box in both horizontal directions, left and right.
vertical
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box in both vertical directions, top and bottom.
top
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box past its top edge.
bottom
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box past its bottom edge.
right
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box past its right edge.
left
Is a <length> or a <percentage> of the amount by which the border image area extends beyond the border box past its left edge.
inherit
Is a keyword indicating that all four values are inherited from their parent's element calculated value.

Specifications

Specification Status Comment
CSS Backgrounds and Borders Module Level 3 Candidate Recommendation Initial specification

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 15.0 15.0 (15.0) 11 15 6
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? 15.0 (15.0) Not supported ? ?

See also

Document Tags and Contributors

Last updated by: LouisLazaris,
Hide Sidebar