overflow

Übersicht

Die overflow Eigenschaft legt fest, ob Inhalte aus einem Element hinausragen dürfen oder, ob Scrollbalken beim Überlauf zum Einsatz kommen.

Standardwert: visible
Anwendbar auf: block, inline und table-cell Elemente
Vererbbar: Nein
Prozentwerte: Nein
Medium: visuell
berechneter Wert: wie festgelegt

Syntax

overflow: visible | hidden | scroll | auto | inherit

Werte

visible: Standardwert. Der Inhalt wird nicht abgeschnitten und kann aus dem Element hinausragen.
hidden: Der Inhalt wird abgeschnitten und es werden keine Scrollbalken angezeigt.
scroll: Es werden immer Scrollbalken angezeigt, auch wenn der Inhalt nicht überläuft.
auto: Hängt vom Browser ab. Firefox stellt Scrollbalken zur Verfügung, wenn der Inhalt überläuft.
inherit: Der Wert des Elternelements wird geerbt.

Mozilla Erweiterungen

-moz-scrollbars-none: stattdessen overflow:hidden
-moz-scrollbars-horizontal: Verwendung von overflow-x (en-US) und overflow-y (en-US) wird bevorzugt.
-moz-scrollbars-vertical: Verwendung von overflow-x (en-US) und overflow-y (en-US) wird bevorzugt.
-moz-hidden-unscrollable: Deaktiviert das Scrollen für das Wurzelelement (<html>, <body>) und ist nur für interne Zwecke gedacht (z.B. Themes).

Beispiele

p {
     width: 12em;
     height: 6em;
     border: dotted;
     overflow: auto;   /* Scrollbalken erscheinen nur wenn nötig */
}

overflow: hidden
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.

overflow: scroll
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.

overflow: auto
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.

overflow: auto
wenig Text

overflow: visible
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.

Bis einschließlich Gecko 1.9.2 (Firefox 3.6), war die overflow Eigenschaft fälschlicherweise auch für Tabellengruppen verfügbar (<thead> , <tbody> , <tfoot>). Dieses Verhalten wurde in späteren Versionen korrigiert.

Spezifikation

Spezifikation	Status	Kommentar
CSS Overflow Module Level 3 Die Definition von 'overflow' in dieser Spezifikation.	Arbeitsentwurf	Changed syntax to allow one or two keywords instead of only one
CSS Box Model Die Definition von 'overflow' in dieser Spezifikation.	Anwärter Empfehlung	No change.
CSS Level 2 (Revision 1) Die Definition von 'overflow' in dieser Spezifikation.	Empfehlung	Initial definition.

Initialwert	`visible`
Anwendbar auf	Block-containers, flex containers, and grid containers
Vererbt	Nein
Berechneter Wert	wie die jeweiligen Kurzschreibweisen: overflow-x (en-US): as specified, except with `visible`/`clip` computing to `auto`/`hidden` respectively if one of overflow-x (en-US) or overflow-y (en-US) is neither `visible` nor clip overflow-y (en-US): as specified, except with `visible`/`clip` computing to `auto`/`hidden` respectively if one of overflow-x (en-US) or overflow-y (en-US) is neither `visible` nor clip
Animationstyp	diskret

Browser Kompatibilität

BCD tables only load in the browser

Siehe auch

Ähnliche CSS Eigenschaften: text-overflow, white-space, overflow-x (en-US), overflow-y (en-US), clip