mozilla

Revision 27852 of column-width

  • Revision slug: CSS/column-width
  • Revision title: column-width
  • Revision id: 27852
  • Created:
  • Creator: Jürgen Jeka
  • Is current revision? No
  • Comment 93 words added, 24 words removed

Revision Content

{{ CSSMozExtensionRef() }}

Summary

In Mozilla applications like Firefox, the -moz-column-width CSS property suggests an optimal column width. The actual column width may be wider (to fill the available space), or narrower (only if the available space is smaller than the specified column width).

  • {{ Xref_cssinitial() }}: {{ Cssxref("auto") }}
  • Applies to: block-level elements
  • {{ Xref_cssinherited() }}: no
  • Percentages: n/a
  • Media: {{ Xref_cssvisual() }}
  • {{ Xref_csscomputed() }}: the absolute length

-moz-column-width was one of the proposals leading to the proposed CSS3 {{ Cssxref("column-width") }} property.

Syntax

-moz-column-width:  <length> | auto 

Values

<length>
See {{ Xref_csslength() }} value for possible units.

Examples

.content-box {
  border: 10px solid #000000;
  -moz-column-width: 300px;
}

Specifications

Browser compatibility

Browser Lowest Version Support of
Internet Explorer --- ---
Firefox (Gecko) 1.5 (1.8) -moz-column-width
Opera --- ---
Safari (Webkit) 3.0 (522) -webkit-column-width

See also

{{ CSS_Reference:Columns() }}

Revision Source

<p>{{ CSSMozExtensionRef() }}</p>
<h3 name="Summary">Summary</h3>
<p>In Mozilla applications like Firefox, the<code> -moz-column-width </code>CSS property suggests an optimal column width. The actual column width may be wider (to fill the available space), or narrower (only if the available space is smaller than the specified column width).</p>
<ul> <li>{{ Xref_cssinitial() }}: {{ Cssxref("auto") }}</li> <li>Applies to: block-level elements</li> <li>{{ Xref_cssinherited() }}: no</li> <li>Percentages: n/a</li> <li>Media: {{ Xref_cssvisual() }}</li> <li>{{ Xref_csscomputed() }}: the absolute length</li>
</ul>
<p><code>-moz-column-width </code>was one of the proposals leading to the proposed <a href="/en/CSS3_Columns" title="en/CSS3_Columns">CSS3</a> {{ Cssxref("column-width") }} property.</p>
<h3 name="Syntax">Syntax</h3>
<pre class="eval">-moz-column-width:  &lt;length&gt; | auto 
</pre>
<h3 name="Values">Values</h3>
<dl><dt>&lt;length&gt; </dt><dd>See {{ Xref_csslength() }} value for possible units. </dd></dl>
<h3 name="Examples">Examples</h3>
<pre>.content-box {
  border: 10px solid #000000;
  -moz-column-width: 300px;
}
</pre>
<h3 name="Specifications">Specifications</h3>
<ul> <li><a class="external" href="http://www.w3.org/TR/css3-multicol/#column-width">CSS 3 Multi-column layout #column-width</a> Working draft</li>
</ul>
<h3 class="editable"><span>Browser compatibility</span></h3>
<table class="standard-table"> <tbody> <tr> <th>Browser</th> <th>Lowest Version</th> <th>Support of</th> </tr> <tr> <td>Internet Explorer</td> <td><strong>---</strong></td> <td><code>---</code></td> </tr> <tr> <td>Firefox (Gecko)</td> <td><strong>1.5</strong> (1.8)</td> <td><code>-moz-column-width</code></td> </tr> <tr> <td>Opera</td> <td><strong>---</strong></td> <td><code>---</code></td> </tr> <tr> <td>Safari (Webkit)</td> <td><strong>3.0</strong> (522)</td> <td><code>-webkit-column-width</code></td> </tr> </tbody>
</table>
<h3 name="See_also">See also</h3>
<p>{{ CSS_Reference:Columns() }}</p>
Revert to this revision