From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001
From: Peter Bengtsson <mail@peterbe.com>
Date: Tue, 8 Dec 2020 14:41:15 -0500
Subject: initial commit

---
 files/de/web/css/column-width/index.html | 99 ++++++++++++++++++++++++++++++++
 1 file changed, 99 insertions(+)
 create mode 100644 files/de/web/css/column-width/index.html

(limited to 'files/de/web/css/column-width/index.html')

diff --git a/files/de/web/css/column-width/index.html b/files/de/web/css/column-width/index.html
new file mode 100644
index 0000000000..2ba1dc5e11
--- /dev/null
+++ b/files/de/web/css/column-width/index.html
@@ -0,0 +1,99 @@
+---
+title: column-width
+slug: Web/CSS/column-width
+tags:
+  - CSS
+  - CSS Eigenschaft
+  - CSS Mehrspalten
+  - Referenz
+translation_of: Web/CSS/column-width
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Übersicht">Übersicht</h2>
+
+<p>Die <strong><code>column-width</code></strong> CSS Eigenschaft schlägt eine optimale Spaltenbreite vor. Dies ist kein absoluter Wert, sondern lediglich ein Hinweis an den Browser, welcher die Breite der Spalte anhand des vorgeschlagenen Wertes anpasst, was skalierbare Designs ermöglicht, die sich verschiedenen Bildschirmgrößen anpassen. Besonders wenn die {{cssxref("column-count")}} CSS Eigenschaft angegeben ist, welche Vorrang hat, wenn es darum geht, eine exakte Spaltenbreite zu setzen, müssen alle Längenwerte angegeben werden. In horizontalem Text sind dies {{cssxref('width')}}, {{cssxref('column-width')}}, {{cssxref('column-gap')}} und {{cssxref('column-rule-width')}}.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="brush:css">/* Schlüsselwortwert */
+column-width: auto;
+
+/* Verschiedene &lt;length&gt; Werte */
+column-width: 6px;
+column-width: 25em;
+column-width: 0.3vw;
+
+/* Globale Werte */
+column-width: inherit;
+column-width: initial;
+column-width: unset;
+</pre>
+
+<h3 id="Werte">Werte</h3>
+
+<dl>
+ <dt><code>&lt;length&gt;</code></dt>
+ <dd>Ist ein {{cssxref("&lt;length&gt;")}} Wert, der einen Hinweis auf die optimale Breite der Spalte gibt. Die tatsächliche Spaltenbreite kann größer (um den verfügbaren Platz auszufüllen) oder schmaler (nur, falls der verfügbare Platz kleiner als die angegebene Spaltenbreite ist) sein. Die Länge muss positiv sein, ansonsten ist sie ungültig.</dd>
+ <dt><code>auto</code></dt>
+ <dd>Ist ein Schlüsselwort, das angibt, dass die Breite der Spalte durch andere CSS Eigenschaften wie {{cssxref("column-count")}} bestimmt werden soll.</dd>
+</dl>
+
+<h3 id="Formale_Syntax">Formale Syntax</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<h3 id="HTML_Inhalt">HTML Inhalt</h3>
+
+<pre class="brush: html">&lt;div class="content-box"&gt;
+Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
+&lt;/div&gt;</pre>
+
+<h3 id="CSS_Inhalt">CSS Inhalt</h3>
+
+<pre class="brush: css">.content-box {
+  border: 10px solid #0ff;
+
+  /* Chrome, Safari, Opera Präfix */
+  -webkit-column-width: 100px;
+
+  /* Mozilla Firefox Präfix */
+  -moz-column-width: 100px;
+
+  column-width: 100px;
+}
+</pre>
+
+<p>{{EmbedLiveSample('Beispiele', '300px', '200px')}}</p>
+
+<h2 id="Spezifikationen">Spezifikationen</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 Writing Modes', '#multicol-intrinsic', 'column-width')}}</td>
+   <td>{{Spec2('CSS3 Writing Modes')}}</td>
+   <td>Fügt innere Größen über die Schlüsselwörter <code>min-content</code>, <code>max-content</code>, <code>fill-available</code> und <code>fit-content</code> hinzu.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Multicol', '#cw', 'column-width')}}</td>
+   <td>{{Spec2('CSS3 Multicol')}}</td>
+   <td>Ursprüngliche Definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Kompatibilität">Browser Kompatibilität</h2>
+
+<p>{{Compat("css.properties.column-width")}}</p>
-- 
cgit v1.2.3-54-g00ecf