Template:Div col

Template documentation

This documentation is transcluded from Template:Div col/doc. [edit] [history] [purge]

The div col (short for division columns) formats a list into columns that wrap at multiple screen resolutions responsively. It automatically breaks the available screen space into equal parts.

Usage and examples

Basic usage

{{div col}}<!-- default width is 30em -->
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}

Produces:

• a
• b
• c
• d
• e
• f
• g
• h

Colwidth

{{div col|colwidth=10em}} <!-- column width of 10em -->
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}

Produces:

• a
• b
• c
• d
• e
• f
• g
• h

Content

{{div col|content=
* a
* b
* c
* d
* e
* f
* g
* h
}}

Produces:

• a
• b
• c
• d
• e
• f
• g
• h

Gap

{{div col|colwidth=10em|gap=2em}} <!-- column width of 10em and a gap of 2em -->
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}

Produces:

• a
• b
• c
• d
• e
• f
• g
• h

Template data

Show/hide template's data

The following information is used by extensions and applications, such as VisualEditor, to help users implement this template onto pages. Please ensure that it is up-to-date. Breaks a list into columns. It automatically breaks each column to an equal space, so you do not manually have to find the half way point on two columns. The list is provided by |content= or closed with {{div col end}}. Template parameters[Edit template data] Parameter Description Type Status Column width colwidth Specifies the width of columns, and determines dynamically the number of columns based on screen width; more columns will be shown on wider displays. Example 30em String optional Gap size gap Specifies the space between the content of adjacent columns. Example 2em String optional HTML class class Specifies any class or multiple space-delimited classes. Example plainlist String optional CSS style style Specifies any custom styling. String optional Content content Specifies the content to divide into columns Content optional

See also

• Same template on Wikipedia