Template:Div col
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}}.
| ||||||||||||||||||||||||||||||