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:

This paragraph has an outline 25px outside the border edge.

Example

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

Try It Yourself

All CSS Outline Properties

Property Description
outline Shorthand 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.