CSS Reference Manual

CSS @rules (RULES)

Comprehensive List of CSS Properties

CSS outline-style attribute CSS outline-color attribute

CSS3 outline-offset attribute usage and examples

outline-The offset CSS attribute is used to set outline-The offset CSS attribute is used to set the space between the outline and the border or element edge. It is the space between the outline and the border or element edge.

The following table provides usage instructions and version history of this attribute, as well as its usage syntax in JavaScript scripts.

Default value:	0
Applies to:	All elements
Inheritance:	None
Animatable:	Yes.Please refer to Animation properties.
Version:	CSS3new feature
JavaScript syntax:	object.style.outlineOffset="15px"

outline-offset usage syntax

The syntax of this attribute is as follows:

outline-offset: length | initial | inherit

The following examples demonstrate how to use outline-offset attribute.

Example

p {
　　　　border:　2px solid red;
　　　　outline:　2px solid green;
　　　　outline-offset:　10px;
}

Test and see‹/›

Attribute value

The following table describes the value of this attribute.

Value	Description
length	Specify the distance from the outline line to the edge of the border. The default value is 0. A negative value will place the outline inside the element.
initial	Set this property to its default value.
inherit	If specified, the associated element adopts its parent element's outline-offset attribute value.

Browser compatibility

outline-Browser compatibility of offset attribute, the numbers in the following table represent the minimum version number of the browser that supports this attribute; all mainstream browsers support this attribute.

	Firefox 3.5+ Google Chrome4+ Internet Explorer × Apple Safari 3.1+ Opera 10.5+

For further reading

Please refer to the following tutorial:CSS outline,CSS border.

Related properties:outline,outline-width,outline-style,outline-color.

CSS outline-style attribute CSS outline-color attribute