column-count

  • Revision slug: CSS/column-count
  • Revision title: column-count
  • Revision id: 27986
  • Created:
  • Creator: Marsf
  • Is current revision? No
  • Comment add link to ja.; 23 words added

Revision Content

{{ CSSMozExtensionRef() }}

Summary

In Mozilla applications like Firefox, the -moz-column-count CSS property can be used to set the ideal number of columns into which the content of the element will be flowed.

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

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

Syntax

-moz-column-count:  <integer> | auto

Values

{{ Xref_cssinteger() }}
Describes the ideal number of columns into which the content of the element will be flowed.

Examples

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

Specifications

Browser compatibility

Browser Lowest Version Support of
CSS3 Candidate Rec. column-count
Internet Explorer --- ---
Firefox (Gecko) 1.5 (1.8) -moz-column-count
Opera --- ---
Safari (Webkit) 3.0 (522) -webkit-column-count

See also

{{ CSS_Reference:Columns() }}

{{ languages( { "ja": "ja/CSS/-moz-column-count" } ) }}

Revision Source

<p>{{ CSSMozExtensionRef() }}</p>
<h3 name="Summary">Summary</h3>
<p>In Mozilla applications like Firefox, the<code> -moz-column-count </code>CSS property can be used to set the ideal number of columns into which the content of the element will be flowed.</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() }}: specified value</li>
</ul>
<p><code>-moz-column-count </code>was one of the proposals leading to the proposed <a href="/en/CSS/CSS3_Columns" title="en/CSS3_Columns">CSS3</a> {{ Cssxref("column-count") }} property.</p>
<h3 name="Syntax">Syntax</h3>
<pre class="eval">-moz-column-count:  &lt;integer&gt; | auto
</pre>
<h3 name="Values">Values</h3>
<dl> <dt>{{ Xref_cssinteger() }}</dt> <dd>Describes the ideal number of columns into which the content of the element will be flowed.</dd>
</dl>
<h3 name="Examples">Examples</h3>
<pre class="eval">.content-box {
  border: 10px solid #000000;
  -moz-column-count:3;
}
</pre>
<h3 name="Specifications">Specifications</h3>
<ul> <li><a class="external" href="http://www.w3.org/TR/css3-multicol/#column-count"> CSS 3 Multi-column layout #column-count</a> Candidate Recommendation</li>
</ul>
<h3>Browser compatibility</h3>
<table class="standard-table"> <tbody> <tr> <th>Browser</th> <th>Lowest Version</th> <th>Support of</th> </tr> <tr> <td colspan="2">CSS3 Candidate Rec.</td> <td><code>column-count</code></td> </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-count</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-count</code></td> </tr> </tbody>
</table>
<h3 name="See_also">See also</h3>
<p>{{ CSS_Reference:Columns() }}</p>
<div class="noinclude">
<p>{{ languages( { "ja": "ja/CSS/-moz-column-count" } ) }}</p>
</div>
Revert to this revision