CSS Outline Offset

CSS Outline Offset

outline-offset The property adds space between the element's outline and the border. The space between the element and its outline is transparent.

The following example specifies an outline 25px outside the border edge:

This paragraph has an outline 25px outside the border.

Example

p {
  margin: 50px;
  border: 1px solid black;
  outline: 1px solid red;
  outline-offset: 25px;
}

Try It Yourself

The following example shows that the space between the element and its outline is transparent:

The outline outside the border of this paragraph is 25px.

Example

p {
  margin: 30px;
  background: yellow;
  border: 1px solid black;
  outline: 1px solid red;
  outline-offset: 25px;
}

Try It Yourself

All CSS Outline Properties

Attribute Description
outline Abbreviated property, sets outline-width, outline-style, and outline-color in one declaration.
outline-color Set the color of the outline.
outline-offset Specify the space between the outline and the edge or border of the element.
outline-style Set the style of the outline.
outline-width Set the width of the outline.