CSS outline-offset Property

Specify a 4 pixels solid red outline 15 pixels outside the border edge:

div {
outline: 4px solid red;
outline-offset: 15px;
}

Definition and Usage

The outline-offset property adds space between the outline and the edge or border of an element.

The space between an element and its outline is transparent.

Outlines differ from borders in three ways:

Default value:	0
Inherited:	no
Animatable:	yes, see individual properties. Read about animatable Try it
Version:	CSS3
JavaScript syntax:	object.style.outlineOffset="15px" Try it

The numbers in the table specify the first browser version that fully supports the property.

Property
outline-offset	4.0	15.0	3.5	3.1	10.5

outline-offset: length|initial|inherit;

Value	Description	Demo
length	The distance the outline is outset from the border edge. Default value is 0	Demo ❯
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit