aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/css/overflow/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/de/web/css/overflow/index.html')
-rw-r--r--files/de/web/css/overflow/index.html130
1 files changed, 130 insertions, 0 deletions
diff --git a/files/de/web/css/overflow/index.html b/files/de/web/css/overflow/index.html
new file mode 100644
index 0000000000..eec5ccd2bc
--- /dev/null
+++ b/files/de/web/css/overflow/index.html
@@ -0,0 +1,130 @@
+---
+title: overflow
+slug: Web/CSS/overflow
+tags:
+ - CSS
+ - CSS Referenz
+translation_of: Web/CSS/overflow
+---
+<p>{{ CSSRef() }}</p>
+
+<h2 id="Übersicht">Übersicht</h2>
+
+<p>Die <code>overflow</code> Eigenschaft legt fest, ob Inhalte aus einem Element hinausragen dürfen oder, ob Scrollbalken beim Überlauf zum Einsatz kommen.</p>
+
+<ul>
+ <li>Standardwert: visible</li>
+ <li>Anwendbar auf: block, inline und table-cell Elemente</li>
+ <li>Vererbbar: Nein</li>
+ <li>Prozentwerte: Nein</li>
+ <li>Medium: visuell</li>
+ <li>berechneter Wert: wie festgelegt</li>
+</ul>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="eval">overflow: visible | hidden | scroll | auto | inherit
+</pre>
+
+<h3 id="Werte">Werte</h3>
+
+<dl>
+ <dt>visible</dt>
+ <dd>Standardwert. Der Inhalt wird nicht abgeschnitten und kann aus dem Element hinausragen.</dd>
+ <dt>hidden</dt>
+ <dd>Der Inhalt wird abgeschnitten und es werden keine Scrollbalken angezeigt.</dd>
+ <dt>scroll</dt>
+ <dd>Es werden immer Scrollbalken angezeigt, auch wenn der Inhalt nicht überläuft.</dd>
+ <dt>auto</dt>
+ <dd>Hängt vom Browser ab. Firefox stellt Scrollbalken zur Verfügung, wenn der Inhalt überläuft.</dd>
+ <dt>inherit</dt>
+ <dd>Der Wert des Elternelements wird geerbt.</dd>
+</dl>
+
+<h4 id="Mozilla_Erweiterungen">Mozilla Erweiterungen</h4>
+
+<dl>
+ <dt>-moz-scrollbars-none</dt>
+ <dd>{{ obsolete_inline() }}  stattdessen overflow:hidden</dd>
+ <dt>-moz-scrollbars-horizontal</dt>
+ <dd>{{ Deprecated_inline() }} Verwendung von <a href="/de/docs/Web/CSS/overflow-x" title="de/CSS/overflow-x"><code>overflow-x</code></a> und <a href="/de/docs/Web/CSS/overflow-y" title="de/CSS/overflow-y"><code>overflow-y</code></a> wird bevorzugt.</dd>
+ <dt>-moz-scrollbars-vertical</dt>
+ <dd>{{ Deprecated_inline() }} Verwendung von <a href="/de/docs/Web/CSS/overflow-x" title="de/CSS/overflow-x"><code>overflow-x</code></a> und <a href="/de/docs/Web/CSS/overflow-y" title="de/CSS/overflow-y"><code>overflow-y</code></a> wird bevorzugt.</dd>
+ <dt>-moz-hidden-unscrollable</dt>
+ <dd>Deaktiviert das Scrollen für das Wurzelelement (&lt;html&gt;, &lt;body&gt;) und ist nur für interne Zwecke gedacht (z.B. Themes).</dd>
+</dl>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<pre>p {
+ width: 12em;
+ height: 6em;
+ border: dotted;
+ overflow: auto; /* Scrollbalken erscheinen nur wenn nötig */
+}
+
+</pre>
+
+<p style="overflow: hidden; width: 12em; height: 6em; border: dotted;"><code>overflow: hidden</code><br>
+ Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
+
+<p style="overflow: scroll; width: 12em; height: 6em; border: dotted;"><code>overflow: scroll</code><br>
+ Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
+
+<p style="overflow: auto; width: 12em; height: 6em; border: dotted;"><code>overflow: auto</code><br>
+ Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
+
+<p style="overflow: auto; width: 12em; height: 6em; border: dotted;"><code>overflow: auto</code><br>
+ wenig Text</p>
+
+<p style="overflow: visible; width: 12em; height: 6em; border: dotted;"><code>overflow: visible</code><br>
+ Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
+
+<h2 id="Hinweise">Hinweise</h2>
+
+<p>Bis einschließlich Gecko 1.9.2 (Firefox 3.6), war die <code>overflow</code> Eigenschaft fälschlicherweise auch für Tabellengruppen verfügbar (<code>&lt;thead&gt;</code> , <code>&lt;tbody&gt;</code> , <code>&lt;tfoot&gt;</code>). Dieses Verhalten wurde in späteren Versionen korrigiert.</p>
+
+<h2 id="Spezifikation">Spezifikation</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Spezifikation</th>
+ <th scope="col">Status</th>
+ <th scope="col">Kommentar</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('CSS3 Overflow', '#propdef-overflow', 'overflow')}}</td>
+ <td>{{Spec2('CSS3 Overflow')}}</td>
+ <td>
+ <p>Changed syntax to allow one or two keywords instead of only one</p>
+ </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS3 Box', '#propdef-overflow', 'overflow')}}</td>
+ <td>{{Spec2('CSS3 Box')}}</td>
+ <td>No change.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS2.1', 'visufx.html#overflow', 'overflow')}}</td>
+ <td>{{Spec2('CSS2.1')}}</td>
+ <td>Initial definition.</td>
+ </tr>
+ </tbody>
+</table>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Browser_Kompatibilität">Browser <span>Kompatibilität</span></h2>
+
+<p>{{Compat("css.properties.overflow")}}</p>
+
+<h2 id="Siehe_auch">Siehe auch</h2>
+
+<ul>
+ <li>Ähnliche CSS Eigenschaften: {{cssxref("text-overflow")}}, {{cssxref("white-space")}}, {{Cssxref("overflow-x")}}, {{Cssxref("overflow-y")}}, {{Cssxref("clip")}}
+</li></ul>
+
+<p>{{ languages( { "en": "en/CSS/overflow" } ) }}</p>