CSS Outline Offset

< 1 min read

The outline-offset property adds space between an outline and the edge/border of an element. The space between an element and its outline is transparent.

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

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

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

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

This paragraph has an outline of 15px outside the border edge.

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

All CSS Outline Properties #

Property Description
outline A shorthand property for setting outline-width, outline-style, and outline-color in one declaration
outline-color Sets the color of an outline
outline-offset Specifies the space between an outline and the edge or border of an element
outline-style Sets the style of an outline
outline-width Sets the width of an outline

Powered by BetterDocs

Leave a Reply