Our volunteers haven't translated this article into Deutsch yet. Join us and help get the job done!
You can also read the article in English (US).

The outline-offset CSS property sets the amount of space between an outline and the edge or border of an element. An outline is a line that is drawn around an element, outside the border edge. The space between an element and its outline is transparent; in other words, it is the same as the parent element's background.

/* <length> values */
outline-offset: 3px;
outline-offset: 0.2em;

/* Global values */
outline-offset: inherit;
outline-offset: initial;
outline-offset: unset;

Initial value0
Applies toall elements
Inheritedno
Mediavisual, interactive
Computed valueas specified, but with relative lengths converted into absolute lengths
Animation typea length
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Syntax

Values

<length>
The width of the space between the element and its outline. A negative value places the outline inside the element. A value of 0 places the outline so that there is no space between it and the element.

Formal syntax

<length>

Example

p {
  outline: 1px dashed red;
  outline-offset: 10px;
  background: yellow;
  border: 1px solid blue;
  margin: 15px;
}
<p>Gallia est omnis divisa in partes tres.</p>

Specifications

Specification Status Comment
CSS Transitions
The definition of 'outline-offset' in that specification.
Working Draft Defines outline-offset as animatable.
CSS Basic User Interface Module Level 3
The definition of 'outline-offset' in that specification.
Candidate Recommendation Initial definition

Browser compatibility

 

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support1 ?1.5 No9.51.2
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidIE mobileOpera AndroidiOS Safari
Basic support ? ? ? ? ? ? ?

 

Schlagwörter des Dokuments und Mitwirkende

 Zuletzt aktualisiert von: fscholz,